开发时遇到当el-form-item的数据是循环的时候,需要每一项添加验证规则,且只能输入数字和小数
<el-row :gutter="20" v-if="enterprise.baseTopics.length !== 0">
<el-col
:span="12"
v-for="(item, index) in enterprise.baseTopics"
:key="index"
>
<el-form-item
:label="item.name"
:prop="`baseTopics.${index}.value`"
:rules="[
{
trigger: 'blur',
pattern: /^[0-9]+(.[0-9]+)?$/, //验证只能输入小数和数字
message: `请输入数字或小数`,
},
]"
>
<el-input
type="text"
:placeholder="'请输入' + item.name"
v-model="item.value"
>
<template slot="append">{{ item.unit }}</template>
</el-input>
</el-form-item>
</el-col>
</el-row>