自己给自己挖的坑

事情经过 接到业务需求 要求做一个折扣分解 也就是拆折扣 细化
下面是原型 应该很好懂吧

这个组建是根据el-element-ui里的el-table改动的 支持自定义添加行 之前的博客里面有详细的方法 这里不再赘述
由于当时需求就是新增 并没有涉及回显 甲方爸爸也没提 于是乎
我：‘后端大哥你要什么格式的数据？’
大哥：‘折扣 A : $ 111 , 折扣 B : $ 222 ’
ok 说干就干 说时迟那时快 一会搞定了 发版发版 上线上线 甚是开心～～

OK 程序运行一切稳定 一天两天 三天。。。。
过了个年。。。。。。
。。。。。
。。。。
。。
。

甲方：‘哎 这边怎么没有回显，加个回显是不是对操作者友好一点’
em。。。。。。
是好 真好呀 （其实当时我有考虑到回显功能，只是偷个懒没和甲方交流）

改起 本来以为很so easy的但是
突然发现后端返回的数据格式都是之前穿进去的数据是字符串格式
'折扣A : $ 111 , 折扣B : $ 222 ’
由于使用的是el-table组建 回显的话需要数组包对象格式
[{“newNumOne”:“aaa”,“newNumTwo”:“111”}] 这样
哎 封装转换格式吧
修改传参形式为数组包对象形势
大致就是造成了这么个问题

字符串 ‘aaa :  $ 111 , bbb :  $ 222 , ccc :  $ 333 , ’

转化

数组
[
{"newNumOne":"aaa","newNumTwo":"111"},{"newNumOne":"bbb","newNumTwo":"222"}
{"newNumOne":"ccc","newNumTwo":"333"}
]

封装解决方案：

				let str = 'aaa:$111,bbb:$222,ccc:$333,'
				//首先逗号分割
                  str = str.split(',') 
                  //删除最后一个空元素
                  str.pop()
                  //创建一个数组
                  let array = []
                  //关键部分循环遍历
                  str.forEach(item => {
                    array.push({
                      newNumOne: item.slice(0, item.indexOf(':') ), 
                      //indexOf传入字符串返回其所在下标索引切割出aaa
                      newNumTwo: item.slice(item.indexOf('$') + 1),       
                      //切割出111
                    })
                  })
                  console.log(array)
            

然后再把封装好的数据赋值给到el-table的date里 回显完成

总结：开发要带脑子想周全，不要抱有庆幸想法，方案多和甲方爸爸交流，甲方爸爸说好那才是真的好。