错误如图所示:

修改方法:在ContentBar.vue文件中的data写上return返回值。
必须写return的原因:
在简单的vue实例中看到的Vue实例中data属性是如下方式展示的:

在使用组件化的项目中使用的是如下形式:

vue的文件data中不写return{ }返回值的话,包裹的数据会在项目的全局可见,会造成变量污染。
使用return后数据中变量只在当前组件中生效,不会影响到其他组件,就不会报错。
子父组件传值时,子组件收到参数后不能直接修改,用一个回调函数来调用到父组件进行修改。
博客主要围绕Vue的return返回值问题展开。指出在ContentBar.vue文件的data中需写return返回值,若不写,包裹的数据会全局可见造成变量污染,使用return后变量仅在当前组件生效。还提到子父组件传值时,子组件收到参数不能直接修改,要用回调函数调用父组件修改。





