Skip to content

具名插槽的缩写 ​

本节目标:理解“具名插槽的缩写”的核心思路,并能把它用于实际开发或面试表达。 2.6.0 ==新增== ==可把参数之前的所有内容==

 (v-slot:)

==替换为字符== #==。例如== v-slot:header ==可以被重写为== #header==:==

<base-layout>
  <template #header>
    <h1>Here might be a page title</h1>
  </template>
  <p>A paragraph for the main content.</p>
  <p>And another one.</p>
  <template #footer>
    <p>Here's some contact info</p>
  </template>
</base-layout>

缩写必须传递参数 ==和其它指令一样,==#==缩写后必须写==name==参数。这意味着以下语法是无效的:== \<!-- ==这样会触发一个警告==

 --><current-user #="{ user }">  {{ user.firstName }}</current-user>

==如果你希望使用缩写的话,你必须始终以明确插槽名取而代之:==

<current-user #default="{ user }">  {{ user.firstName }}</current-user>

本站总访问 — 次