vue.js高仿饿了么课程踩坑

初学vue,跟着老师学习高仿饿了么项目，老师初讲课程是vue1.0版本，自己直接用的2.5版本，踩了不少坑，看vue官方文档解决了各种问题，今天踩的坑如下：

 对应代码：

 

 

查询官方文档对computed的描述：“计算属性是基于它们的依赖进行缓存的，只在相关依赖发生改变时它们才会重新求值”，报错代码中的计算属性listShow的依赖是data中的fold，listShow中报错代码this.fold = true，根据computed的官方描述，个人理解为：计算属性是依赖于data中的数据,根据其依赖进行相应的改变，而不应该操作data中的数据，所以此处报错，第二处报错，computed中访问$refs报错，查询官方文档相关描述：“关于 ref 注册时间的重要说明：因为 ref 本身是作为渲染结果被创建的，在初始渲染的时候你不能访问它们 - 它们还不存在！”，“$nextTick将回调延迟到下次 DOM 更新循环之后执行”，报错代码中的$refs是在$nextTick中的，按描述ref的访问没问题，为什么在computed中报错还没有理解，尝试解决方案：

修改过后运行：

 

 无报错，better-scorll实现的滚动效果也无异常，关于computed中访问$refs报错问题，有些困惑，希望在接下来的学习中尽快解决，第一篇博客，记录一下自己的学习过程，如有错误，还请各位大牛指正！