当前位置: 首页 > 网络应用技术

VUE动态多级形式添加,删除,更改检查和验证

时间:2023-03-06 22:33:53 网络应用技术

  项目需求是:您可以添加很多标准,一对一的标准,输入,评分和其他功能,每个点可以删除,每个大标准都可以删除。完成的产品如下:下面:

  Element UI提供了动态增加或减少表单项目,但只有一层。我们的数据需要遍历多级遍历渲染,这与需求不太吻合,因此我们需要自己编写。分为创建和编辑,我们只说创建零件在这里。无论是添加,删除的项目或添加物,还是在开始时删除点,它都不涉及背景接口接口关节调整。纯前端操作。以下是基本布局:

  尽管它是动态创建的,但我们最初提供了一个表单框,以进行其他删除和修改。以下是数据初始化期间的变量和值绑定:

  我是用背景确认的数据格式(在涉及编辑器时将呈现页面呈现),因此数据格式最好统一,并且更方便。

  删除得分点

  删除评分项目

  deleteitem(index){

  this.obj.evaluationItemparamdto.splice(索引,1);

  },复制代码以添加分数或添加评分项目(无论是添加还是在判断下添加评分项目)

  简单操作后,提交它以检查表单的所有项目。如何检查多个周期渲染的数据?以下步骤是密钥,请查看屏幕截图:

  如果以前的循环写作没有问题,请单击以将其提交到下面的验证

  在这一点上,对多级循环表格的验证成功???,如果您有任何疑问,请拜迪或再次删除它,因为我在这里没有问题!一起工作!

  作者:达比