1. 程式人生 > 其它 >vue 封裝資料字典項翻譯方法

vue 封裝資料字典項翻譯方法

核心方法

Object.keys返回一個所有元素為字串的陣列,其元素來自於從給定的object上面可直接列舉的屬性。

// simple array
var arr = ['a', 'b', 'c'];
console.log(Object.keys(arr)); // console: ['0', '1', '2']

// array like object
var obj = { 0: 'a', 1: 'b', 2: 'c' };
console.log(Object.keys(obj)); // console: ['0', '1', '2']

// array like object with random key ordering
var anObj = { 100: 'a', 2: 'b', 7: 'c' }; console.log(Object.keys(anObj)); // console: ['2', '7', '100']

utils資料夾下新建 index.js中封裝方法

// 回顯分類字典
export function selectClassFlyDict(datas, value) {
    var actions = [];
    Object.keys(datas).some((key) => {
        if (datas[key].code == ('' + value)) {
            actions.push(datas[key].name);
            
return true; } }) return actions.join(''); }

main.js中引入 並在全域性掛在 方便後續通用

import { selectClassFlyDict } from "@/utils/index";
// 全域性方法掛載
Vue.prototype.selectClassFlyDict = selectClassFlyDict

在元件裡面呼叫


<el-table-column label="申報來源" align="center" prop="declSource" v-if="columns[39].visible" width="200">
<template slot-scope="scope">
{{ sourceClassify(scope.row.origin) }}/{{ sourceClassify(scope.row.originDetail)}}
</template>
</el-table-column>




methods: {
// 翻譯來源 sourceClassify(value){ return this.selectClassFlyDict(this.sourceList,value); },
}