vue3中，element-plus中el-input的v-model和value的用法示例

BillKu

已于 2025-04-12 11:59:54 修改

阅读量43

点赞数 1

文章标签： vue.js elementui javascript

于 2025-04-12 11:59:33 首次发布

本文链接：https://blog.youkuaiyun.com/BillKu/article/details/147162684

版权

el-input的v-model，邦定响应式变量

        <el-col :span="6">
          <el-form-item label="检验类别" prop="verifyType">
            <el-input v-model="applyAllInfo.applyBasicInfo.verifyTypeName" readonly />
          </el-form-item>
        </el-col

el-input的value，邦定函数返回值，实现复杂业务处理

        <el-col :span="6">
          <el-form-item label="评价类型">
            <el-input :value="getTypeValue(applyAllInfo.applyBasicInfo.wspjType)" readonly />
          </el-form-item>
        </el-col>

// 获取类型值
const getTypeValue = (key: number) => {
  // 建立类型与值之间的映射关系
  const keyValueMap: Record<number, string> = {
    0: "不评价",
    1: "卫生评价",
    2: "检验结论",
    3: "卫生评价+检验结论"
  };
  return keyValueMap[key];
};

运行效果