【VUE】有没有类似React中<>空标签的东西呢?
问:Vue中有没有类似React中空标签的东西呢?答:有。
·
问:Vue中有没有类似React中<>空标签的东西呢?
答:有
不废话直接上方案:
方案一
vue2/3应该是通用的方式,vue3上可行
若上级使用到<Transition>
会提示:
[Vue warn]: Component inside<Transition>
renders non-element root node that cannot be animated.
<template>
// 这里作为一个空标签根节点
// 记得加上v-if="true",要不不显示内容
<template v-if="true">
<common-header />
<slot />
<common-footer />
</template>
</template>
方案二
基于vue-fragment
资料来源:https://www.cnblogs.com/chenss15060100790/p/16381081.html
github:https://github.com/Thunberg087/vue-fragment
Ps: nuxt3中用不了
- 安装fragment
npm i -s vue-fragment
调整main.js,将fragment添加到Vue中
import Fragment from 'vue-fragment'
Vue.use(Fragment.Plugin)
方案三
基于Vue3,使用显性attr绑定
https://cn.vuejs.org/guide/components/attrs.html#attribute-inheritance-on-multiple-root-nodes
更多推荐
已为社区贡献4条内容
所有评论(0)