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，这样就能在组件相应的位置插入需要的信息了。

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