校验表单必填项是否全部已填,提交按钮在必填项全部已填状态下才可点击
export default {
  data(){
      return{
         companyName:"", //公司名称
         companyAddress:"", //公司地址
         uploadPhotos:"", //营业执照
         btnState:false //提交按钮状态
      }
  },
  computed: {
    companyInfo() {
        const { companyName,companyAddress,uploadPhotos} = this
        return {
            companyName,
            companyAddress,
            uploadPhotos,
        }
    }, 
  },
  watch:{
      companyInfo: {
        handler: function(newval , oldval) {
             if(Object.keys(this.filterParams(newval)).length == 3){ //判断已输入的值与必填项数量是否一致,如果一致则可点击下一步,否则按钮状态为不可点击
             	 this.btnState = true;
             }else{
                 this.btnState = false;
             }
        },
        deep: true
      },
  },
  methods: {
  	//删除对象中的空值
		filterParams(obj){
		  let _newPar = {};
		  for (let key in obj) {
		      //如果对象属性的值不为空,就保存该属性(这里我做了限制,如果属性的值为0,保存该属性。如果属性的值全部是空格,属于为空。)
		      if ((obj[key] === 0 || obj[key]) && obj[key].toString().replace(/(^\s*)|(\s*$)/g, '') !== '') {
		          //记录属性
		          _newPar[key] = obj[key];
		      }
		  }
		  //返回对象
		  return _newPar;
		}
  }
Logo

前往低代码交流专区

更多推荐