shu-c-data-dict

全局数据过滤转换器

安装和快速上手

npm 安装

安装依赖包

• shuCDataDict

npm i shu-c-data-dict --save

• vue

npm i [email protected] --save

• lodash （帮助函数插件）

lodash如果使用的是脚手架那么可能脚手架已经帮你安装了（比如：Vue CLI）。

npm i lodash --save

CDN

iife 格式未构建，请使用 webpack 和 npm 进行开发安装。

快速上手

在 main.js 中写入以下内容：

import Vue from 'vue';
import inject from "./inject.js";
import axios from "axios";

Vue.use(inject);
new Vue({
  mounted(){
    // 使用已经加载完成的 $dict 实例加载接口
    Vue.prototype.$dict.import(
      axios.get('/dict/getDictDataByTypeList')
    );
  },
  render: h => h(App)
}).$mount('#app')

inject.js

import { shuCDataDict } from '../components/shu-c-data-dict.cjs';

export default {
  install: (Vue, options = {}) => {
    Object.defineProperty(Vue.prototype, '$dict', {
      value: new shuCDataDict({ label: 'name', code: 'id' })
    });
  }
}

inject.js 中的 { label: 'name', code: 'id' } 和数据字典中数据的 key 和 value 对应。

'/dict/getDictDataByTypeList' 接口数据格式：

const aDictList = [
    {
      name: '融资产品类型',
      data: [
        { id: 1, name: '基金贷' },
        { id: 2, name: '基金担' },
        { id: 3, name: '基金租' },
        { id: 4, name: '基金联投' },
        { id: 5, name: '基金保' },
        { id: 6, name: '基金套保' }
      ]
    }
  ];

Browsers support

Modern browsers and IE10.

| IE / Edge | Firefox | Chrome | Safari | Opera | | --- | --- | --- | --- | --- | | IE10, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |

last 2 versions 每个浏览器最新的两个版本

Contributors

This project exists thanks to all the people who contribute.

zhangh-design