Question

我有一个名为 vue-select 的组件，它是我安装的第三方打包程序。我想在此组件的每个实例中放置一个插槽模板。我的意思是我想做这样的事情：

<v-select>
 <span slot="no-options">
   <li>sample text</li>
 </span>
</v-select>

，并且我不想在项目中的每个 v-select 中执行此操作。我该如何干燥我的代码？谢谢：）

Answer 1

当您想要使组件模板的各个部分不同时，该插槽很有用。如果您始终希望它是同一块模板，则不要将其作为插槽。只需将所需的标记添加到组件的模板中即可。

这类似于如果您不想更改某些内容，则不要将其作为函数的参数。

function spin (element) {
  const angle = 360
}

如果您希望某个选项具有一些通用内容，但有时仍会对其进行更改，则将默认内容放入组件模板的<slot>标记中。

这类似于在函数中添加默认参数：

function spin (element, angle = 360) { }

如果您已经具有定义了插槽及其默认内容的第三方组件，因此您无法更改它们，请先将它们包装在另一个组件中，然后在其余的代码中使用包装器组件。

>

这类似于添加一个新函数，该函数调用前一个函数，但对某些参数进行硬编码。

function halfSpin (element) {
  spin(element, 180)
}