element ui from表单里文本框根据不同参数rules触发不同提示信息

Element UI 的 `el-form` 组件里的文本框，通常配合 `el-form-item` 和 `v-model` 使用，其中的验证规则 `rules` 可以动态设置。如果你想根据不同的参数控制提示信息，可以这样做：

1. 首先，在你的数据模型 (data) 中，为需要特殊验证的字段定义一个对象，这个对象包含验证规则以及对应的提示信息。例如：

data() {
  return {
    myForm: {
      inputField: '',
      customRules: { // 这是一个对象，key是你自定义的验证条件，value是对应的消息
        requiredWhenCondition: [
          { rule: 'required', message: '请输入信息' }, // 如果条件成立，规则生效
          { message: '无需输入' } // 如果条件不成立，显示此消息
        ]
      }
    }
  };
}

2. 然后，在 `el-form-item` 的 `rules` 属性中，你可以使用一个函数来检查条件，并返回相应的规则数组。例如，假设有一个条件变量 `shouldShowCustomRules`：

<template>
  <el-form :model="myForm">
    <el-form-item label="输入" prop="inputField">
      <el-input v-model.trim="myForm.inputField"></el-input>
      <!-- 使用计算属性动态设置验证规则 -->
      <span v-if="shouldShowCustomRules">[{{ myForm.customRules.requiredWhenCondition }}]</span>
    </el-form-item>
  </el-form>
</template>

<script>
export default {
  data() {
    return {
      shouldShowCustomRules: this.$route.params.specialCondition === 'true' // 示例，根据路由参数判断是否显示定制规则
    };
  },
  computed: {
    formItemRules() {
      return this.shouldShowCustomRules ? this.myForm.customRules.requiredWhenCondition : [{ required: true }];
    }
  }
};
</script>

在这个例子中，如果 `specialCondition` 参数为 'true'，则会根据 `customRules` 显示特定的提示信息；否则默认使用 `{ required: true }` 的规则。