vuex对于复杂数组、对象的改变及页面重新渲染问题

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_36070288/article/details/84304717

引言：对于vuex结合小程序不知道怎么使用的小伙伴可以看我的这篇文章vuex结合小程序使用详细介绍

先看效果

属性切换动态修改vuex内容且体现在界面上

先简单介绍下本文要用的关键数据及结构

attributeList

• 属性数组，具体作用及结构如下：

• 先不管为什么后台要给这么坑爹的数据让前端处理，如果大家碰到这样复杂的数据，改如何实时改变动态渲染到页面
• 大家可以发现数组里是两个对象，每个对象里还有一个我们需要的数组，暂且就叫innerArr，如何通过改变innerArr里某项里的属性值动态渲染到界面

接下来介绍改变的技巧：

• 点击属性时执行下面函数

• setAttributeListExchange接收一个对象，对象里带了大数组的下标和大数组要改变的下标项

• setAttributeListExchange方法到底做了什么？

• 更新数组，之所以用数组的splice方法，大家可以看看vue文档的介绍vue数组更新检测

希望这个思路可以帮助到需要的朋友！