vue: 动态表单实现(多问题线)

vue: 动态表单实现(多问题线)

之前写了一篇单问题线,这次写的是多问题线的逻辑思想。

在这里插入图片描述
如图,所谓的多问题线就是若问题块1的select1选了A,select2选了A,则会出现问题块3和问题块5,此时问题块3和问题块5是同级的,且不在一个问题线上,所以该次答题,至少有两条线上的答案需要获取。

这种情况下,上次的逻辑思想就无法解决该情况,就有了一个新的解决思路来解决,并且能解决多问题线的思路必能解决单问题线的问题。

需求需要解决的点:

  1. 逻辑结构不定,为后端提供
  2. 层级不定,由逻辑结构决定
  3. 填到最下面的叶子结点后,获取全部用户所填有效的问题结果
  4. 有创建和编辑功能,利用答案,反铺该答案所对应的表单

解决思路:
创建3个组件:

  • index组件:整个表单

主要逻辑:
标示自己的父问题状态

铺页面:
循环逻辑结构数组,若fa为null或rule[fa].ans的答案等于faV时展示

提交答案:
循环逻辑结构数组,若fa为null或rule[fa].ans的答案等于faV时,获取答案

逻辑结构样例&#x

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值