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

相关推荐
芭拉拉小魔仙15 小时前
企业级Vue项目的状态管理:从原理到实战架构
前端·vue.js·架构
扶苏100216 小时前
Vue 3 响应式原理深度解析
前端·javascript·vue.js
装不满的克莱因瓶18 小时前
Java7新特性:try-with-resources写法
java·前端·javascript·jdk·新特性·jdk7
哆啦A梦158820 小时前
Vue3魔法手册 作者 张天禹 06_监控
前端·vue.js·typescript
半兽先生1 天前
使用 retire.js 自动检测前端 JavaScript 库漏洞
开发语言·前端·javascript
扶苏10021 天前
详解Vue3的自定义 Hooks
前端·javascript·vue.js
专注VB编程开发20年1 天前
WebView2 处理跨域访问限制,Frame脚本执行,难度比CEF大10倍
前端·javascript·.net
Highcharts.js1 天前
Highcharts角度仪表(Angular Gauge)完全指南:从速度表到工业监控,一文学会gauge与solidgauge实战开发
javascript·angular.js·开发文档·highcharts·图表开发·实心仪表
css趣多多1 天前
Vue 响应式无限递归问题总结
前端·javascript·vue.js
014-code1 天前
Vue3 性能优化实战
前端·vue.js·性能优化