slot插槽以及具名插槽

今天刚入职新公司，看了新公司的项目代码感觉和之前自己做的项目还是有差距的。自己之前做的项目相对于新公司来说可能还是偏浅，所以无论是框架还是原生的js都要去更加深入的了解才能应对之后的项目。

都知道vue组件可以通过slot插槽插入自定义的信息，但是往更加深入的slot了解的话会发现，slot插槽也有其他更加复杂的场景。
具名插槽就是其中的一个。

具名插槽可以让你可以自定义多处组件中可以插入内容的地方，这对复杂的组件来说谁十分有用的。这边直接上代码了
 

子组件

<template><div class='list'><slot name="slot1" /><div>slot1</div><slot name="slot2" /><div>slot2</div><slot name="slot3" /><div>slot3</div></div>
</template>

父组件

<ListItem><div slot="slot1">你好1</div><div slot="slot2">你好2</div><div slot="slot3">你好3</div></ListItem>

子组件通过slot标签定义name属性，然后父组件通过slot属性对应子组件的slot标签的name，这样就能在组件相应的位置插入需要的信息了。

新的公司对我来说是一个挑战，也是一个机会这次我要专心的当好我的小兵。期待不就得将来弯道超车！！！加油！！！