了解并使用 Vue 中的插槽和插槽范围 - 何时使用插槽？

简单的举个栗子：有2个组件，父组件father，子组件son。

父组件 father

<template>
    <div>
        <h3>这是父组件</h3>
        <son>实践slot</son>
    </div>
</template>

子组件 son

<template>
    <div>
        <h4>这是子组件</h4>
        <input type="text" placeholder="请输入">
    </div>
</template>

一般我们的组件都会怎么写，但是这么写的话，会发现子组件中的实践slot是显示不出来的。如果需要让他显示出来，这时我们就可以用到插槽slot了。