学习内容
⊙ 组件可以访问Vue实例数据吗
⊙ 父子组件的通信
⊙ 组件通信-父传子
⊙ 组件通信-子传父
组件可以访问Vue实例数据吗
我们可以测试一下:
得出的结果是不行的
Vue组件应该有自己保存数据的地方
这样会报错:
我们看看正确的写法:
我们来用组件实现一下之前的计数器:
父子组件的通信
父传子写法
但是也会觉得奇怪
为什么里面明明是变量却写成字符串的形式呢?其实有很多种写法:
注意: 如果我们在props中使用的是驼峰命名法,使用的时候用''-''连接,否则会报错
子传父写法
这个会比较复杂一点
应用场景:
当前我们在子组件中定义了一些数据:
现在我们要根据点击的板块,来将数据传给父组件,告诉父组件用户点击的是哪个板块
但是还没将数据传给父组件
接下来要在子组件的methods中做一些操作:
cpn当然是要定义在父组件中的:
唉感觉这个有点复杂有点难T T,等会需要复习一下了
就先到这里吧,我需要复习一下前面的内容去了