vue提取字符串中中文汉字的大写首字母

1.需求背景

• 最近开发vue项目，在关于药品的项目中有个需求是要提取药品中文名称的首字母组成拼音码。

解决方案

• 这里需要用到pinyin-pro插件，参数介绍如下：

• 

• 使用如下：

• 
  // 1、安装pinyin-pro：
  npm install pinyin-pro -S
  
  // 2、在项目中引入：
  import { pinyin } from 'pinyin-pro'
  
  // 3、提取中文首字符，并转为大写字母：
  const pinYinCode = pinyin(codeName, {
                pattern: 'first',
                toneType: 'none',
                type: 'array',
              }).join('').toUpperCase()
  
  

• 其他使用示例，自取：

• 
  import { pinyin } from 'pinyin-pro';
  
  // 获取带音调拼音
  pinyin('汉语拼音'); // 'hàn yǔ pīn yīn'
  // 获取不带声调的拼音
  pinyin('汉语拼音', { toneType: 'none' }); // 'han yu pin yin'
  // 获取声调转换为数字后缀的拼音
  pinyin('汉语拼音', { toneType: 'num' }); // 'han4 yu3 pin1 yin1'
  // 获取数组形式带音调拼音
  pinyin('汉语拼音', { type: 'array' }); // ["hàn", "yǔ", "pīn", "yīn"]
  // 获取数组形式不带声调的拼音
  pinyin('汉语拼音', { toneType: 'none', type: 'array' }); // ["han", "yu", "pin", "yin"]
  // 获取数组形式声调转换为数字后缀的拼音
  pinyin('汉语拼音', { toneType: 'num', type: 'array' }); // ["han4", "yu3", "pin1", "yin1"]
  
  // 获取声母
  pinyin('汉语拼音', { pattern: 'initial' }); // 'h y p y'
  // 获取数组形式声母
  pinyin('汉语拼音', { pattern: 'initial', type: 'array' }); // ["h", "y", "p", "y"]
  
  // 获取带音调韵母
  pinyin('汉语拼音', { pattern: 'final' }); // 'àn ǔ īn īn'
  // 获取不带音调韵母
  pinyin('汉语拼音', { pattern: 'final', toneType: 'none' }); // 'an u in in'
  // 获取音调为数字的韵母
  pinyin('汉语拼音', { pattern: 'final', toneType: 'num' }); // 'an4 u3 in1 in1'
  // 获取数组形式带音调韵母
  pinyin('汉语拼音', { pattern: 'final', type: 'array' }); // ["àn", "ǔ", "īn", "īn"]
  // 获取数组形式不带音调韵母
  pinyin('汉语拼音', { pattern: 'final', toneType: 'none', type: 'array' }); // ["an", "u", "in", "in"]
  // 获取数组形式音调为数字的韵母
  pinyin('汉语拼音', { pattern: 'final', toneType: 'num', type: 'array' }); // ['an4', 'u3', 'in1', 'in1']
  
  // 返回韵头
  pinyin('村庄', { pattern: 'finalHead', type: 'array' }); // [ '', 'u' ]
  
  // 返回韵腹
  pinyin('村庄', { pattern: 'finalBody', type: 'array' }); // [ 'ū', 'ā' ]
  
  // 返回韵尾
  pinyin('村庄', { pattern: 'finalTail', type: 'array' }); // [ 'n', 'ng' ]
  
  // 获取音调
  pinyin('汉语拼音', { pattern: 'num' }); // '4 3 1 1'
  // 获取数组形式音调
  pinyin('汉语拼音', { pattern: 'num', type: 'array' }); // ["4", "3", "1", "1"]
  
  // 获取拼音首字母
  pinyin('赵钱孙李额', { pattern: 'first' }); // 'z q s l é'
  // 获取不带音调拼音首字母
  pinyin('赵钱孙李额', { pattern: 'first', toneType: 'none' }); // 'z q s l e'
  // 获取数组形式拼音首字母
  pinyin('赵钱孙李额', { pattern: 'first', type: 'array' }); // ['z', 'q', 's', 'l', 'é']
  // 获取数组形式不带音调拼音首字母
  pinyin('赵钱孙李额', { pattern: 'first', toneType: 'none', type: 'array' }); // ['z', 'q', 's', 'l', 'e']
  
  // 获取多音
  pinyin('好', { multiple: true }); // 'hǎo hào'
  // 获取数组形式多音
  pinyin('好', { multiple: true, type: 'array' }); // ["hǎo", "hào"]
  // text 不为单个字符时 multiple 不生效
  pinyin('好学', { multiple: true }); // hào xué
  
  

• 解决。