vuejs / core

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
https://vuejs.org/
MIT License
46.86k stars 8.22k forks source link

transition和keep-alive结合使用,使用vue3的fragement多个根路径写法时报错 #4995

Closed jzfai closed 2 years ago

jzfai commented 2 years ago

What problem does this feature solve?

appMain.vue image

vue3 Page image

has issue image

第二种写法 appMain.vue image 此时不报错了, 我加多了一个div,但是不动画了

What does the proposed API look like?

我想使用vue3的fragement多个根路径写法时,同时想要缓存和动画,且不报错,我需要怎么写,或者有什么解决方案。

项目地址:https://github.com/jzfai/vue3-admin-template

caozhong1996 commented 2 years ago

image

Dude, you can do like this 老哥,你把这个组件套一层div,像下面这样应该就可以了

<template>
  <div>
    <div>这是父组件</div>
    ....
  </div>
</template>

But I think it should be a bug... 但是我觉得这个应该算bug...

LinusBorg commented 2 years ago
  1. This reproduction is a whole template - we need a minimal reproduction focused on the actual problem.
  2. It seems you try to transition to a component that renders multiple root nodes - that's not possible, as the error message states.
jzfai commented 2 years ago

这个是vue3支持的写法,我为什么要套一层div呢,我就想要这种写法

image

Dude, you can do like this 老哥,你把这个组件套一层div,像下面这样应该就可以了

<template>
  <div>
    <div>这是父组件</div>
    ....
  </div>
</template>

But I think it should be a bug... 但是我觉得这个应该算bug...

vue3支持多个根路径写法,我为什么要在最外层套一个div呢,这样vue3的多个根路径写法,不是浪费了吗