Element基础入门

使用公共枚举，例如显示性别（EnumGender表示显示性别，Ethnic表示名族，Political表示政治面貌）：
    
                   
   

枚举下拉框，使用字典类型（DICT）
    1、js必须先获取相应的字典数据
        //初始化下拉数据，用于页面不展示但是业务中需要对对应的类型格式化 DICT,ENUM
        HjDict.initLocalData([{'dictSource': HjDict.DB.DICT, 'nameList': ['EnumCameraType']}]);
    2、

下拉列表：
    
                                                v-for="item in sexOptions"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                   
   
   在Vue中的data这样设置：
    sexOptions: [{
                    value: '1',
                       label: '男'
                 }, {
                    value: '2',
                    label: '女'
                }]

分页方法：（handleCurrentChange是访问的方法）
                

                                            @current-change="handleCurrentChange"
                        layout="total,prev, pager, next,jumper"
                        :current-page.sync="table.page"
                        :page-size="table.pageSize"
                        :total="table.total">
                   
               

在el-table中获取行信息使用scope.row；如：
                    

动态生成多选框：
    方法1、    
    方法2、    
            
上传图片成功后删除图片：
    1、在上传图片的地方添加 ref="picUpload"      
    2、在成功和取消的方法里添加 self.$refs.picUpload.clearFiles();

    
图片可放大：
            
    
表格中多选的禁止点击操作：
            在el-table-column中添加监听方法 :selectable='checkboxInit' 如下
            
            checkboxInit: function (row, index) {
                if (row.checkFlag !== 1) {
                    return 1;
                } else {
                    return 0;
                }
            }
table中多选获取值：
        页面：在el-table中添加监听方法@selection-change="handleSelectionChange"，如下
            
            在el-table中添加列
            
        方法：
            //多选获取值(选择状态改变后调用获取值)
            handleSelectionChange: function (val) {
                var self = this;
                self.tableSelection = val;
            }
            
            
输入框数值范围限制(50-100):
        data里：
            form: {
                dialogVisible: false,
                ruleForm: {
                    number: '',                    
                },
                rules: {
                    number: [
                        {validator: self.valueRangCheck, trigger: ['blur', 'change']},
                        {required: true, message: '该项为必填项', trigger: ['blur', 'change']}
                    ]
                }
            }
        methods里
            valueRangCheck: function (rule, value, callback) {
                var self = this;
                self.valueRange(1, 200, value, callback);
            },