wcc-component v0.1.14

wcc-component 我查查通用组件库

安装

npm install wcc-component --save
-- or
yarn add wcc-component

使用

在vue.config.js中增加以下配置

// 第三方引入需要babel转换的包
transpileDependencies: ["wcc-component"],

入口文件中

import Vue from 'vue';
// 引入css
import 'wcc-component/style/index.css';
import WccComponent from 'wcc-component';
// 不需要扩展
Vue.use(WccComponent);
// or 需要扩展列头筛选组件的 默认支持组件 'date', 'dateTime', 'input' 具体可以查看RenderHeadEdit.js
// Vue.use(WccComponent, {table: {input: {xxx: 组件对象, select: ...}}})
Vue.use(WccComponent, {
    table: {
        input: {
            select: ,// 组件对象 可参考TableInput.vue
        },
        // 数据转换扩展 不用可以不写
        colFormatFnMap: {
            /**
             * 后台数据转换方法扩展
             * @param fetchData 后台返回数据
             * @param formatData 已转换好的数据
             * @return 转换好的数据
             */
            apiData(fetchData, formatData) {
                // 如后台字段和已定义的字段不一致 也可通过此方法转换兼容
                // 默认居中
                return Object.assign({
                    align: 'center'
                }, formatData)
            },
            /**
             * 列数据转换方法扩展
             * @param com 列组件对象
             * @param formatData 转换好的数据
             * @return {any} 返回转换好的数据
             */
            comData(com, formatData){
                // 可以在此对列组件设置的属性进行转换
                return formatData;
            }
        }
    }
});

代码中使用参考App.vue文件