element-ui表单验证不提供message参数如何实现提示信息国际化?

Question

项目使用 element-ui和vue-i18n来做验证和国际化，在配置表单验证的时候我到一个问题，能不能在设置el-form表单验证的rules属性的时候，规则里面不设置message属性可以自动实现国际化（类似jquery.validate）？

如下：

rules: {
    //, message: '姓名不能为空'
    Name: [{ required: true, trigger: 'blur' }],
},

我希望可以不设置message属性来实现国际化（配合vue-i18n），毕竟错误提示信息格式都一样，每个地方写太费事了。

Answer 1

不设置message没试过，我是用循环来生成rules规则的，你可以试试循环的时候用vue-i18n对message进行转换

    // 初始化验证数据
    initRules () {
      const obj = {},
        fieldList = this.formInfo.fieldList
      // 循环字段列表
      for (let item of fieldList) {
        let type = item.type === 'select' ? '选择' : '输入'

        if (item.required) {
          if (item.rules) {
            obj[item.value] = {
              required: item.required,
              validator: item.rules,
              trigger: 'blur'
            }
          } else {
            obj[item.value] = {
              required: item.required,
              message: '请' + type + item.label,
              trigger: 'blur'
            }
          }
        }
      }
      this.formInfo.rules = obj
    },

Answer 2

把校验规则rules放在computed当中即可。

原理：在data里rules中的$t()已经将结果返回，依赖收集监听的也是返回的这个结果，当切换语言的时候$t()并没有被依赖收集而不会发生更新；而在computed当中rules会被deep收集依赖，当语言环境切换时this.$t()被重新赋值而被监听触发set，页面自然就更新了。

Answer 3

就是切换中英文时候 会触发表单的验证 这个你们怎么处理的