Vue extracts the uppercase initials of Chinese characters in the string

Vue extracts the uppercase initials of Chinese characters in the string

1. Demand background

• In the recent development of the Vue project, there is a requirement in the drug project to extract the first letter of the Chinese name of the drug to form a pinyin code, for example: Liuwei Dihuang Pill is LWDHW after the initial letter is extracted.

solution

• The pinyin-pro plug-in is needed here , and the parameters are introduced as follows:

• 

• Use as follows:

• 
  // 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()
  
  

• Other usage examples, self-collected:

• 
  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é
  
  

• solve.