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的时候是大写,可能注释有误,望大家注意!

相关推荐
雨雨雨雨雨别下啦8 分钟前
Vue3——RabbitShopping
前端·javascript·vue.js
学习指针路上的小学渣1 小时前
JavaScript笔记
前端·javascript
coder_Eight1 小时前
彻底吃透 Promise:从状态、链式到手写实现,再到 async/await 底层原理
javascript·面试
@大迁世界1 小时前
13.在 React 中应怎样正确更新 state?
前端·javascript·react.js·前端框架·ecmascript
苏琢玉2 小时前
Go + Vue 打包成一个单二进制的后台系统,我做了个后台脚手架
vue.js·golang
终端鹿2 小时前
Suspense 异步组件与懒加载实战
前端·vue.js
Shaoxi Zhang2 小时前
pm2运行项目实践记录(通过ecosystem.config.js配置并自动运行)
javascript·python·pycharm
Jinuss2 小时前
源码分析之React中useRef解析
前端·javascript·react.js
cch89182 小时前
css 样式说明,在页面布局开发中,样式表用于控制组件的尺寸、间距、边框及背景等视觉表现
前端·javascript·html
晨枫阳2 小时前
前端项目部署与问题解决
javascript·vue.js·ecmascript