网站促销计算,北京企业网站建设公司,我局 负责 建设 网站,南通网站建设苏鹏网络核心点
1. el-form的model属性需要跟el-form-item的prop要对应
2. el-form的model属性绑定tableData
3. el-form-item的prop绑定字符串#xff1a;scope.index.列名#xff08;注意有个点#xff09;
4. el-form-item需要单独设置rules属性
代码示例
el-form :mod…核心点
1. el-form的model属性需要跟el-form-item的prop要对应
2. el-form的model属性绑定tableData
3. el-form-item的prop绑定字符串scope.index.列名注意有个点
4. el-form-item需要单独设置rules属性
代码示例
el-form :modeltableData :rulestbRulesel-table :datatableDatael-table-columntemplate #defaultscopeel-form-item label名称 :propscope.$index .name :rulestbRules.name!-- 封装一个输入框组件InputCell根据当前行是否开启编辑状态这个变量可以存在scope.row里分别显示输入框或者展示数据 待完善 -- InputCell :rowDatascope.row :columnscope.column/InputCell/el-form-item/template/el-table-column/el-table/el-form
const tableData ref([{name: test}]);
const tbRules {name: [{ required: true, message: 输入不能为空, trigger: blur }]
}
遇到的问题
说明下因为我二次封装了el-table数据和列都是传进去的组件里通过循环输出列所以可能才会出现这个问题吧。
提交时输入框失焦校验都通过但是表单整体校验没过 给校验方法打断点执行发现 遇到scope.$index为-1的时候也在表单中产生了列但这行数据实际不存在所以校验没通过。
暂时规避办法scope.$index等于-1时不渲染el-table-column加个v-if判断。
