最近做项目中, 碰到了点小麻烦:
后台从接口请求回来的城市相关的数据只有城市名称, 没有排序, 铺页面的时候要排序就很麻烦;
面向百度编程时候找到了一个包, 用它来将字符串转成拼音, 就可以通过字符串截取取出拼音首字母, 这样就可以进行首字母排序了.
这个包的名字叫 JS-pinyin.
NPM 下载
NPM i JS-pinyin
下载完了之后在 main.JS 中引入
import pinyin from 'js-pinyin'
这样使用环境就配置好了.
当在组件中使用时, 要先在 export default 前引用 node_modules/JS-pinyin 中的 index.JS 文件:
import pinyin from '../../../node_modules/js-pinyin/index'
注意 node_modules/JS-pinyin 的文件路径
因为我要在页面加载时就使用这个需要排序的数据, 所以我将代码写入 mounted() 中.
在使用真实数据前, 我们先写一个小 demo:
在组件中使用时, 要添加
let pinyin = require('js-pinyin');
和
pinyin.setOptions({checkPolyphone: false, charCase: 0});
两行代码, 一个是引入 JS-pinyin, 一个是配置 JS-pinyin.
完整的 demo 就是这样:
- mounted() {
- let pinyin = require('js-pinyin');
- pinyin.setOptions({checkPolyphone: false, charCase: 0});
- console.log(pinyin.getFullChars('管理员')); //GuanLiYuan
- console.log(pinyin.getCamelChars('管理员')); //GLY
- console.log(pinyin.getCamelChars('1234')); //1234
- console.log(pinyin.getCamelChars('english')); //english
- }
上述 2 个 console.log 中使用的函数, 是 JS-pinyin 中设计好的 2 个函数, 作用分别是:
getFullChars(): 获取字符串全部拼音, 并且首字母大写;
getCamelChars() : 获取字符串拼音首字母, 并大写;
getCamelChars() 中传入的参数不是汉字时, 不会进行转换, 仍然输出源字符串.
来源: http://www.bubuko.com/infodetail-3155708.html