对于初级前端程序员来说,原生js基础不扎实,在敏捷开发追求效率的情况下,快速使用框架会极其容易忽视一些小的却非常关键的知识点,比如我们今天要看的《Vue中数组索引项、对象属性增删无法触发更新检测》,再比如这个前端程序员就是我……
当你在用Vue开发的时候,你可能不经常,只是偶尔地遇到,“哎?我明明把异步数据赋值给我定义的数组变量或者对象变量了,为什么页面上数据还是老旧的并没有改变呢?”,这时候你可能各种尝试,比如把生命周期函数mounted()
更改为created()
,于是数据的重新绑定直接被你提前到new Vue()
节点;或者你在你的数据重新赋值之前插入个alert()
,直接粗暴触发更新检测,但明显我们不允许在页面中出现这个;又或者机智地使用个setTimeout(function(){},0)
,但多测试几次,你会发现,我根本控制不了这个定时器是否一定触发,这特么到底是为什么。终于,碰了几次南墙,你想回头,(怎么可能,你必须解决这个问题,项目必须完成的呀!),所以寻求其他种种方法,绕过了这堵高墙,然后心虚地告诉自己终于解决了,但你根本不知道这里面埋了什么隐患,就等着项目交付的时候全部爆发了。好了,吹牛逼到此结束,老套路,先重现错误:
HTML
<template>
<ul>
&