参考的视频

bus的使用方法

参考

https://www.jianshu.com/p/89406752a369

参考项目学习

参考的视频——尚硅谷的

重要的属性 $children 和 $parent

$children 和 $parent

1、ref为子组件指定一个索引名称，通过索引来操作子组件； 2、this.$parent 可以直接访问该组件的父实例或组件； 3、父组件也可以通过this.$children 访问它所有的子组件； 需要注意$children并不保证顺序，也不是响应式的。

参考博客

父子数据同步 .sync 原理

不使用 sync修饰符的方法

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16

<template>

	<Child @update:money="money= $event" />
</template>

<!--
@update:money 可以，也可以直接 money.sync
-->

<Child money.sync="money" />
<!--
下面是子组件
-->
<button @emit('update:money',money+1)>
    
</button>

参考视频

$attrs 和 $listener 的用法

v-bind="$attrs" 相当于 {...props} 在 react的写法

1
2
3
4
5
6
7
8

<template>
 <Child  @click="console.log(111)"/>
</template>

<!--
上面的 click事件是不会触发的，想要触发，必须在子组件注册 listener
-->
<el-button @v-on="$listener">按钮</el-button>

mixin 组件混用

如果项目当中，很多结构类似的功能， 我们想到组件复用。

主要是项目当中的组件 js业务逻辑相似，就可以考虑用这个功能。

slot 和 slot-scope

参考学习视频

参考博客

slot-scope 可以 结构， slot-scope 只是一个变量命名，没什么特别的含义

7c77c1c57b7111a8327d89c7c6cc970e9e9f344c