vue1.0组件

/**
 * vue组件
 */
Vue.component('my-com', {
    // 组件参数
    props: ['params'],
    // 组件数据
    data: function () {
        return {
            fields: [] // 字段列表
        }
    },

    // 创建
    created: function () {
        var _this = this;
        console.log("vcom-template-field params:", _this.params);
        // 获取入参
        if (!_this.params) {
            console.log("vcom-template-field params is null!");
            return;
        }
        _this.getFieldList();
    },

    // 函数定义
    methods: {
        // 初始化处理
        init: function () {
            var _this = this;
            // 获取模板分类项
            var fieldCodes = JSON.stringify(_this.params.split(","));
            _this.ajax({
                url: ajaxUrl.get.selectTemplateFieldList,
                data: {
                    closeXqcLoading: true, // 不显示加载中
                    fieldCodes: fieldCodes
                }
            }, function (res) {
                _this.fields = res.rows || [];
                console.log('分类项列表:', _this.fields);
            });
        }
    },

    // 模板
    template: '\
        <table class="table mb-0">\
            <thead>\
                <tr style="height: 45px;">\
                    <th v-for="field in fields" style="border:1px solid #ddd;text-align: center;background-color:#f3f3f3;" \
                    v-bind:style="field.source==\'SYSTEM_MAN\'?\'background-color:#f3f3f3\':\'\'" nowrap="nowrap">{{field.name}}</th>\
                </tr>\
            </thead>\
            <tbody id="content">\
            </tbody>\
        </table>\
    '
});