zoukankan      html  css  js  c++  java
  • 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); },
    }
  • 相关阅读:
    win10家庭版转专业版并激活
    关于vcruntime140D.dll丢失问题
    phpMyAdmin使用教程
    在wamp中直接进入项目
    sublime Text3的使用
    wamp的安装配置
    PHP Web开发入门流程
    PHP与MySQL的亲密接触
    flex 布局 实现电商页面商品展示floor
    html css+div+jquery实现图片轮播
  • 原文地址:https://www.cnblogs.com/ddqyc/p/15386833.html
Copyright © 2011-2022 走看看