js react 中文+英文混合排序

背景是需要对一个英文字母和汉字混合的某属性进行首字母排序

npm i pinyin -S
// 下载将中文转成拼音的插件

首先将数组进行渲染

const sortData =  map(arr, item => {
      if (item?.name[0].charCodeAt(0) > 255) { //判断如果是汉字
        const firstText = item?.name.slice(0, 1); // 将name的子一个字裁下来
        const firstWord = pinyin(firstText)[0][0].slice(0, 1);//转成拼音后的首字母裁下来
        return {
          ...item,
          fontKey: firstWord, //存储为新增字段fontKey
        };
      }
      return {
        ...item,
        fontKey: item?.name[0], //如果不是汉字 直接裁第一个字母下来
      };
    });

然后根据fontKey进行排序

const result = sortData ?.sort((after: any, before: any) => {
     return after?.fontKey.localeCompare(before?.fontKey);
});

// 此时的result 就是排序后的节后

// 倒叙 就更改为 before?.fontKey.localeCompare(after?.fontKey) 即可