1.0.2 • Published 2 years ago

shu-c-data-dict v1.0.2

Weekly downloads
-
License
MIT
Repository
-
Last release
2 years ago

shu-c-data-dict

全局数据过滤转换器

安装和快速上手

npm 安装

安装依赖包

  • shuCDataDict
npm i shu-c-data-dict --save
  • vue
npm i vue@2.6.13 --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 / EdgeFirefoxChromeSafariOpera
IE10, Edgelast 2 versionslast 2 versionslast 2 versionslast 2 versions

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

Contributors

This project exists thanks to all the people who contribute.

zhangh-design

1.0.2

2 years ago

1.0.1

3 years ago

1.0.0

3 years ago