element表单校验rules数据更新后不是实时生效的

Question

有两个按钮 （save、post） 每个按钮校验规则不同
我在点击其中一个按钮的时候将 rules 修改为对应的规则
`

//修改为save
this.rules = this.validator('landlordAuthorityForSave')
const validate = await this.validatorSubmit('landlord')
  if (!validate) {
    this.$message.error(this.$i18n.t('InvalidFormMessage.value'))
    return false
  }
  //  save验证通过

`

//修改为post
  this.rules = this.validator('landlordAuthority')
  const validate = await this.validatorSubmit('landlord')
  if (!validate) {
    this.$message.error(this.$i18n.t('InvalidFormMessage.value'))
    return false
  }
  //  post验证通过

`

我在第一次点击save的时候为save的验证规则.
然后我点击post的时候,规则应该修改为了post的规则,但还是按着save的验证规则走的
我第二次点击post的时候，就改为post的校验规则了。
这里该如何处理呢？

Answer 1

你将一个对象赋值给this.rules,是修改了this.rules的地址值，vue不能监测到数值变动。
使用this.$forceUpdate();强制更新 或者 使用对象操作方法修改this.rules