vue3 Component inside ＜Transition＞ renders non-element root node that cannot be animated.
这是＜Transition＞中的组件渲染无法设置动画的非元素根节点。
<router-view v-slot="{ Component }"><transition appear mode="out-in"><component :is="Component" /></transition>
</router-view>检查 router-view 里的路由的组件有哪个是多个要元素的，要改成一个根元素就行
就像这样，这是vue3支持多个根元素，但过渡效果只支持一个根元素
<template><div><div>数据报告</div><button class="#626aef">按钮</button><el-button color="#626aef" plain>Default</el-button></div>
</template>vue3 Component inside ＜Transition＞ renders non-element root node that cannot be animated.相关推荐
- vue3 出现 Component inside ＜Transition＞ renders non-element root node that cannot be animated.
项目使用vite脚手架+vue3,在根组件App.vue当中使用了页面过渡动画 首页index.vue 代码 结果控制台出现 Component inside <Transition> ...
- quasar使用keep alive警告 Component inside ＜Transition＞ renders non-element root node
问题描述 提示:这里描述具体问题:在项目中使用缓存来保持页面不被更新,但是在使用keep-alive时会给出警告.vue3缓存与vue2缓存不一样,需要注意.下面是代码. <router-vie ...
- vue 页面跳转路由 不显示内容Component inside ＜Transition＞ renders non-element root node that cannot be animated.
显示信息: Component inside <Transition> renders non-element root node that cannot be animated. 原因: ...
- vite、vue3警告：Component inside ＜Transition＞ renders non-element root node that cannot be animated.
一.问题代码 <template><section><router-view v-slot="{ Component }"><transi ...
- 解决 Component inside ＜Transition＞ renders non-element root node that cannot be animated 问题
问题现象 今天在用Arco的组件库的时候遇到一个问题: 在route路由中引入一个页面 component: () => import('@/views/demands/demand-list/ ...
- vue Component inside ＜Transition＞ renders non-element root node that cannot be animated.
警告:没有用根节点,无法使用动画 在router-view上 使用div标签包住, <div><router-view v-slot="{ Component }" ...
- Error: illegal invocation in ＜execute＞ or ＜revert＞ phase (action: element.updateProperties或Laber)
报错类似于:Error: illegal invocation in <execute> or <revert> phase (action: element.updatePr ...
- warn]: Component inside Transition renders non-element root node that cannot be animated.
因为比较简单先说解决方法: 用一个 div 把 过渡到的 代码(组件代码) 包起来即可 详情: 用到 transition: (提升用户体验组件动画) 警告信息: 过渡的 组件 代码: 解决:(用d ...
- vue项目点击后，从左边或右边滑出组件，再次点击原路滑回。＜transition＞、transform
[需求] 点击某个元素,屏幕右边滑出组件(页面) [方法] 参考vue-进入/离开 & 列表过渡 把引入的组件用< transition >标签包括住,例: <transit ...
最新文章
- 什css3新增的属性,CSS
- centos 对某ip开放 防火墙端口_CentOS7 firewalld防火墙指定IP与端口访问
- html5图片怎么顶格,iQOO 5系列几乎达到了“顶格”的性能状态。
- oracle百分之0.01就成了.01,遭遇ORA-01200错误的原因及解决方法
- 理解搜索引擎并且善用google
- python类的属性和对象属性_Python打印对象的全部属性
- cisco hsrp备份小实验
- python口号_编程语言的口号
- Magicodes.IE已支持通过模板导出票据
- ipython安装成功后用不了_ipython安装避坑指南
- IR2104半桥驱动
- 人民搜索副总经理宫玉国离职
- 计算机键盘标注,电脑键盘上怎么打√和×
- 我的python学习（前言 初生牛犊不怕虎）
- 机器人学资料站-202108
- 第11章 Linux的网络管理
- SpringBoot重启后，第一次请求接口请求慢的解决方案
- 如何下载B站视频以及音频
- Pymediainfo读取文件夹视频长度并写入Excel文件（openpyxl）
- Codeforces D. Omkar and Bed Wars