element tree 初始化 表单验证初始化

问题:

使用this.$ref['form'] .resetFields()无法重置表单项

原因:

1.没有给表单添加ref属性 (且名字不能和 :model="addForm" 名字重复 否则不起作用 )
2.表单项el-form-item没有添加prop属性,prop属性需要与input框绑定的属性一致


         
           
             
             
               
                 
部门选择

3.data 类型

data() {
      var checkUname = (rule, value, callback) => {
        var regx = /^[a-zA-Z0-9_]{4,16}$/;
        if (value == "") {
          callback(new Error("请输入用户名"));
        } else if (!regx.test(value)) {
          callback(new Error("用户名必须是4~6位数字、字母或下划线"));
        } else {
          callback();
        }
      };
   
      // 真实姓名校验
      var validatePass = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请输入姓名'));
        } else {
          if (this.LoginorgCode == '') {
            callback(new Error('请先选择部门再填写姓名'));
          } else {
            /*api.getBeyLoginName({
              realName: value,
              orgCode: this.LoginorgCode
            }).then(res => {
              console.log("res", res)
              if (res.code == 'code_200') {
                this.nameSeq = res.data.nameSeq;
                callback(new Error("该用户名已存在请用" + res.data.loginAlias + "登录"));
              } else {
                callback();
              }
            });
          */

          }
        }
      };
 
      return {
     
        treeData:[
        {
          id: 1,
          label: "品牌一",
          children: [
            {
              id: 4,
              label: "华东区域",
              children: [
                {
                  id: 9,
                  label: "上海"
                },
                {
                  id: 10,
                  label: "昆山"
                }
              ]
            }
          ]
        },
        {
          id: 2,
          label: "品牌二",
          children: [
            {
              id: 5,
              label: "华东区域"
            },
            {
              id: 6,
              label: "华南区域"
            }
          ]
        },
        {
          id: 3,
          label: "品牌三",
          children: [
            {
              id: 7,
              label: "华北区域"
            },
            {
              id: 8,
              label: "华南区域"
            }
          ]
        }
      ],
        props: {
          label: "departmentName",
          children: "children"
        },
   
        // 编辑相关数据
        addFormResource: {
          account: [{required: true, validator: checkUname, trigger: "blur"}],
   
          name: [{required: true, validator: validatePass, trigger: 'blur'}]
          
        },
        // 添加绑定的数据
        addForm: {
          // account: "",
          departmentId: "",
          departmentPid: "",
          name: "",
          flag: "1",
          phone: "",
          userRoleIds: "",
          roles: "",
          policeNumber: '',
          loginAlias: ''
        },
        //按钮权限
        btnShow: {
          insertUserAndRoleInfo: 0,
          selectById: 0,
          updateUserInfo: 0, //修改
          updateUserUsingUserByIds: 0, //启用用户
          updateUserForbidByIds: 0 //禁用用户
        },
        
        treeId: "",
        depList: [],
        isAddTree: false
      };
    },

4.调用方法

this.refs.depTree.setCheckedKeys([]); // 注意点击事件影响

@node-click="nodeClick"
@check-change="checkChange"

可能会对 tree 值产生影响 使,重置无效

// 取消
      cancleDialog(type) {
        var self = this;
        //self.$refs["addForm"].resetFields(); //清空\
        console.log(self.$refs,"this.$refs");
        this.$nextTick(()=>{
          this.$refs.addForm1.resetFields() //注意 addForm1 
        });

        //self.$refs.depTree.$children[0].setCheckedKeys([]);
        self.isAddTree = true;
        if(self.isAddTree){
          self.$refs.depTree.setCheckedKeys([]); // 注意点击事件影响
          self.isAddTree = false
        }
        console.log(self.$refs.depTree.$children[0],"sdfsfsdfsdfsdfsdf")
        //self.$refs.depTreebj.setCheckedKeys([]);
        //self.$refs.depTreeck.setCheckedKeys([]);

      
      },

你可能感兴趣的:(element tree 初始化 表单验证初始化)