前端字符动态匹配思想

因为在代码中常见命名方式为英文，可很多时候显示在页面上的是中文，便于别人阅读的东西，在最近的项目中进行了思考（可能前人已经想出来，但我自己没查出来），自己思考了一种动态匹配字符算法，把英文转换成中文

这个思维利用了JS中的对象的特点

var object = {
	one: 1
}
console.log(Object[one]) // 1

其实思维很简单，因为js中对象的[ ]属性可以传入变量来动态返回数据，利用传入的参数动态的匹配就可以转换成想要的数据名称，比如上面代码中就把one转换成了数字类型1来进行使用，此方法在前端使用中应用极广 如下代码 在vue中动态的做路由和文字的匹配

<template>
  <div class="about">
    <div v-for="(item, index) in router" :key="index">
      <router-link :to="'/' + item">{{ dataList[item] }}</router-link>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      dataList: {
        index: '首页',
        login: '登陆',
        myself: '个人中心'
      },
      router: ['index', 'login', 'myself']
    }
  }
}
</script>

页面显示效果如下

更加复杂的比如匹配路由，设计数据字典样式如下

在vue的使用中把所有的接口参数放在vuex中，调用接口时方便快捷。

自己思考出的一种前端字符动态匹配思想，可以优化前排对数据的处理