旧的代码如下:
<template slot="title">{{ item.title }}</template>
{{ item.title }} 是一个模板标签,它在模板中插入了一个元素(slot),并指定了元素的名称为 “title”。这个标签在模板中显示为一个空白元素,可以通过设置其 data 属性来提供内容。
但是会报错:
解决方法:
在Vue.js中,slot
是一种分发内容的机制,用于在子组件中插入内容。slot
的使用中有一种旧的语法,即在template
标签上使用slot
属性,这种语法已被弃用。
解决方法是使用新的语法,在插入位置使用slot
标签,如下所示:
<template> <div> <slot name="title"></slot> </div></template>
在调用处使用v-slot
指令,如下所示:
<my-component> <template v-slot:title> {{ item.title }} </template></my-component>
这样就可以避免slot
attributes are deprecated vue/no-deprecated-slot-attribute的警告。