Vue 中的井号 (#) 是啥意思？

Posted 2023-02-22

【中文标题】Vue 中的井号 (#) 是啥意思？

【英文标题】：What do the hash marks (#) mean in Vue?Vue 中的井号 (#) 是什么意思？

【发布时间】：2020-12-23 03:08:15

【问题描述】：

我是一个相当新的 Vue 开发人员。 在我们的堆栈中，无论我走到哪里，我都会在我们的组件组件中看到这样的代码：

<template #item.active=" value ">
  <div :aria-label="String(value)" class="text-center">
    <v-icon v-if="value === null">mdi-minus</v-icon>
    <v-icon v-else color="red">mdi-close</v-icon>
  </div>
</template>

对于我的一生，我无法弄清楚#item.active（特别是#）实际上做了什么。我们有许多散列项。喜欢<template #item.actions-prepend="item"> 或<template #toolbar-extension>

谷歌搜索#并不是一件容易的事。 显然我在我的 Vue 教程中错过了这个特定的视频！ 我们使用 Nuxt 和 Vuetify，不确定是否有帮助！

【问题讨论】：

这是v-slot 属性的简写。

真的吗？谢谢埃德里克！

“谷歌搜索 # 不是一件容易的事。”我同意，谢谢你的问题！

“谷歌搜索 # 不是一件容易的事” -> 搜索这个实际上是一场噩梦。即使在阅读了这篇文章之后，我仍然找不到文档在哪里提到这一点，除了在v-slot 旁边说“速记：#”......非常感谢您提出答案并以可搜索的方式措辞

是的 vue 文档有点烂。

【参考方案1】：

正如 cmets 中所提到的，# 符号是 v-slot 属性的简写，正如 <template> 的用法所暗示的那样（v-slot 只允许在以及组件上使用）在你的代码中。

【讨论】：

谢谢先生！我会把你标记为答案。当然，现在我知道要谷歌什么了，我到处都能找到！