写出这个优化之前,是因为服务器有点差,每次修改上下架状态的时候,发送修改状态的请求,为了页面显示的"文本"状态也改变,还需要发送一次初始化列表的数据,对于以后数据量大的时候,是很不友好的,而且前端的优化,不就是减少请求么,所以就想着优化一下.
思路:
1.后端返回的初始化表单数据,我存在了data()的tableData中,上下架的状态( 0:下架 1:下架 )
2.html代码,elementUI在表单中已经帮我们封装好了vue的插槽,其实就是slot-scope,我们直接用就好
3.js代码
其实elementUI的表格示例给了我很大的启发,通过scope.$index得到当前行在tableData的下标,然后修改tableData的值,因为vue的特性,tableData值被修改,则会重新渲染表单,这样就不用发送初始化表单的请求了
所以我的部分js代码:
尾言: 因为学识浅,所以只想到这个一个方法,大佬如果有更好的方法,请下方留言,不胜感激!