vue输入中文,获取英文首字母缩写

背景:要求输入中文的时候,系统给出对应的首字母大写,作为拼音。

例如:输入"博客",输出'BK' 等等......

经查:使用 js-pinyin 这个第三方插件即可实现

1. 下载依赖
javascript 复制代码
npm install js-pinyin
或者
yarn add js-pinyin
2. 导入包使用
javascript 复制代码
import pinyin from 'js-pinyin'
3. 使用方法
javascript 复制代码
<el-input v-model="name" @change="changeIndName"></el-input>
changeIndName (e) {
  let char = ''
  pinyin.setOptions({ checkPolyphone: false, charCase: 2 })
  char = pinyin.getCamelChars(e)
},

关于setOptions函数中两个参数解释如下

使用过程中我发现:charcase传0的时候是全部拼音,1的时候是首字母小写,2的时候是大写,可能注释有误,望大家注意!

相关推荐
BIM云平台开发12 分钟前
【App.vue里跟踪页面跳转和用户ID】
开发语言·前端·javascript
云空1 小时前
《Three.js 完整版3D魔方:带贴纸+中心固定+自动求解复原》
前端·javascript·3d·three.js
gis开发之家1 小时前
《Vue3 从入门到大神33篇》Vue3 源码详解(三):响应式核心思想——从 Object.defineProperty 到 Proxy
前端·javascript·vue.js·vue3·vue3源码
云空2 小时前
《Three.js 可操控3D魔方(键盘转动+打乱+复原)》
javascript·学习·游戏·3d·three.js
qq_529599382 小时前
react js循环滚动
前端·javascript·react.js
濮水大叔3 小时前
在 DTO 中使用 Form Layout 配置复杂表单,支持 Tabs/Groups/Sections
vue.js·typescript·node.js
张人玉3 小时前
Vue 3 + ECharts 智慧城市大屏——赣州智慧城市数据可视化平台
vue.js·echarts·智慧城市
come112343 小时前
Vue 3 与现代 JavaScript 常用语法指南
前端·javascript·vue.js
dsyyyyy11013 小时前
用JavaScript实现排序算法
开发语言·javascript·排序算法
槑有老呆3 小时前
从零搭建 LLM 流式对话前端:一文读懂 SSE、二进制流与 Vue 3 响应式
前端·javascript