组件共享 与不共享的区别!!!

JavaScript对象是引用关系,所以如果return出的对象引用了外部的一个对象,那这个对象就是共享的,任何一方修改都会同步:

             
结果:同时进行点击,三者一体! 示例图:

在这里插入图片描述

组件使用了3次,但是点击任意一个button,3个的数字都会加1,那是因为组件的data引用的是外部对象,这肯定不是我们期望的效果,所以给组件返回一个新的data对象来独立,示例代码:

             
结果:三者不同,点击三个分别显示不同数据 示例图:

组件共享 与不共享的区别!!!_第1张图片

—————————————————————————————————————————————————————
注意事项:博文的质量普通,仅供参考。盲目复制,处处是坑,三思后行!

你可能感兴趣的:(前端Vue.js,vue.js组件区别!,组件对象的不同引用)