Vuejs2 Vue.js-元素UI-动态规则验证表单

我正在使用

vue-js2.3

和

元素ui

我想动态地定义表单的验证规则

例子

问题

required

不是由

phoneMandatory动态定义的

问题
如何动态更改现有规则的属性？
如何动态添加或删除规则？
在组件的
数据
方法中有
规则
属性。这意味着它不会根据对其他数据属性的更改进行更新

您应该为
规则
使用计算属性：

computed: {
  rules() {
    return { 
      phone: [{ 
        required: this.phoneMandatory, 
        message: 'Please input phone', 
        trigger: 'blur' 
      }]
    }
  }
},

现在，当
this.phoneMandatory
更新时，组件的
规则也会更新

你是个天才