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

相关推荐
计算机学姐12 小时前
基于SpringBoot的自习室座位预定系统【预约选座+日期时间段+协同过滤推荐算法+数据可视化统计】
java·vue.js·spring boot·后端·spring·信息可视化·tomcat
雨季66612 小时前
构建 OpenHarmony 简易 BMI 健康指数计算器:用基础数学实现健康自评
javascript·flutter·ui·自动化·dart
晚霞的不甘13 小时前
Flutter for OpenHarmony:从零到一:构建购物APP的骨架与精美UI
前端·javascript·flutter·ui·前端框架·鸿蒙
ElasticPDF-新国产PDF编辑器13 小时前
基于 PDF.js 的 PDF 文字编辑解决方案,纯前端 SDK,跨平台、框架无关、Web 原生
前端·javascript·pdf
带带弟弟学爬虫__13 小时前
速通新Baidu Frida检测
前端·javascript·vue.js·python·网络爬虫
好学且牛逼的马13 小时前
ES6 核心语法精讲
前端·ecmascript·es6
子春一13 小时前
Flutter for OpenHarmony:用 Flutter 构建一个数字猜谜游戏:从零开始的交互式应用开发
javascript·flutter·游戏
Y淑滢潇潇14 小时前
WEB 作业 三个练习题
前端·javascript·css3
EndingCoder14 小时前
性能优化:类型系统的最佳实践
linux·前端·javascript·ubuntu·性能优化·typescript
晚霞的不甘14 小时前
Flutter for OpenHarmony:注入灵魂:购物车的数据驱动与状态管理实战
android·前端·javascript·flutter·前端框架