vuejs国际化之select

一、下拉框

1、计算属性中放数据源

computed: {

statusOptions() {

            let arrays = [];

            PERSONNEL_SOURCE.forEach(v => {

              let obj = Object.assign({}, v);

              obj.label = this.$i18n.tp(obj.label);

              arrays.push(obj);

            });

            return arrays;

          }

}

代码截图如下

2、elementUI中书写

3、数据源

// 人员类型数据源

export const PERSONNEL_SOURCE = [

  {

    value: '1',

    label: 'dict.personType.centStaff'

  }, {

    value: '2',

    label: 'dict.personType.forAgent'

  }, {

    value: '3',

    label: 'dict.personType.abroad'

  }, {

    value: '4',

    label: 'dict.personType.selfEmployed'

  }, {

    value: '5',

    label: 'dict.personType.overseas'

  }

];

4、点击某一行编辑时,将personType转为对应的语言的字体

字典中定义类型

5、列表中展示