Vue3.x属性继承报错解决

最新推荐文章于 2024-05-24 18:26:39 发布
最新推荐文章于 2024-05-24 18:26:39 发布
阅读量1.4w 收藏 2
点赞数 1
分类专栏： vue 文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_38888512/article/details/117224108
版权

编写vue组件的时候莫名报了下面的警告:

[Vue warn]: Extraneous non-props attributes (border, style) were passed to component but could not be automatically inherited because component renders fragment or text root nodes.
at xxxx(发生问题的组件位置)
at ...

解决：

在自定义组件上添加了border、style属性，而自定义组件内部又未去接收，因此警告了。
所以，要么在组件内部加上属性接收。如果是在第三方库UI库的话，建议直接去掉这些属性。

皮皮停
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Vue.js 3.X常见错误及解决方案
02-28
Vue.js 3.X常见错误及解决方案
vue3.x中使用cesium，vue3.x+Cesium
05-04
在`vue.config.js`文件中，添加以下配置： ```javascript module.exports = { configureWebpack: config => { config.resolve.alias = { ...config.resolve.alias, 'cesium': path.resolve(__dirname, 'node_...
vue控制台报错Extraneous non-props attributes (class) were passed to component but could not be automatica
热门推荐
Ama_Lee的博客
04-03 6万+
完整报错信息 Extraneous non-props attributes (class) were passed to component but could not be automatically inherited because component renders fragment or text root nodes. 报错翻译 无关的非道具属性(类)被传递给组件，但不能被自动继承，因为组件呈现片段或文本根节点。 存在的问题 根据报错信息 首先检查是否传递了没有解析的属性，可以检查一下你用的第
【vue警告】[Vue warn]: Extraneous non-props attributes (class) were passed to component but could
周金鱼啊
11-23 6674
[Vue warn]: Extraneous non-emits event listeners (refreshRelationList) were passed to component but could not be automatically inherited because component renders fragment or text root nodes. If the listener is intended to be a component custom event liste
警告：Extraneous non-props attributes (data) were passed to component but could not be automatica
最新发布
goodnight2333333的博客
05-24 487
这个警告一般是因为在Vue组件中，给组件传递了没有在组件props中声明的属性。这可能会导致意外行为，因为这些属性并不会被组件自动接收。只需要在子组件中定义并接受父组件传来的参数，即可解决警告~
Extraneous non-props attributes (XXX) were passed to component but could not be automatically
qq_26905813的博客
11-01 1万+
就是你有需要传输一个prop属性的数据给子组件，但是你在子组件中忘记用defineProps接收，无意中触发了透传 Attributes，在使用setup语法糖的情况下注意使用defineProps接收props属性数据。你确确实实需要传递一个非prop属性数据到子组件中，但子组件中存在多个根节点，你可以在该根节点使用v-bind=”$attrs"进行显式绑定，就可以避免报错了。就是你不需要传输一个prop属性的数据给子组件，但是你在整理代码时，忘记将父组件的子组件标签中的:xxx=“xxx"删除。
vue3 组件naiveui报错： Extraneous non-props attributes (class) were passed to component but could not be
什么意思哦
12-13 2524
vue3 组件naiveui报错 Extraneous non-props attributes (class) were passed to component but could not be automatically inherited because component renders fragment or text root nodes.
解决Extraneous non-props attributes (border, class) were passed to component but could not be
weixin_43934104的博客
08-30 9080
建议去element-plus官网文档查看自己的属性是哪里不对https://element-plus.gitee.io/zh-CN/component/dialog.html看图，我的组件里面写的这个el-dialog就有两个地方不对，跟官方的属性对不上就改成官方的，class也不能用了，得按照官方文档去设置属性。...
webstorm和.vue中es6语法报错的解决方法
12-09
1.webstorm中es6语法报错，解决方法： 打开 Settings => Languages & Frameworks => Javascript 把 Javascript Language version 改为 ECMAScript 6 这样做所有的.js文件中es6不再报错，但是.vue文件中es6语法依然...
02.Vue3.x语法.md
09-07
02.Vue3.x语法.md
前端-Vue3.x-知识图谱
02-19
Vue3.x是Vue.js框架的最新版本，它在性能、API设计、响应式系统等多个方面进行了重大改进，为开发者带来了更高效、更灵活的开发体验。这份“前端-Vue3.x-知识图谱”旨在全面概述Vue3.x的核心概念、特性和最佳实践。 ...
Vue3 网页版报错或警告集锦（一）
yuanyuan1995的博客
07-21 1284
Extraneous non-props attributes (class) were passed to component Extraneous non-props attributes (class) were passed to component but could not be automatically inherited because component renders fragment or text root nodes
Vue3报错Extraneous non-props attributes (xxx) were passed to component but could not be ...
DM_Cxx的博客
06-09 2万+
今天在重构项目时遇到一个报错，趁有时间整理学习理解一下。首先的话这不是什么特别严重的报错。赶时间的朋友可以直接滑到最下面看解决办法。
[vue3.x]实战问题--Extraneous non-props attributes
m0_54850952的博客
03-09 2193
Vue3.x 开发问题 开发环境 问题描述 问题解析 开发环境 "vue-i18n": "^9.1.6", "vue-router": "^4.0.0-0", "vuex": "^4.0.0-0" 问题描述 Extraneous non-props attributes (class) were passed to component but could not be automatically inherited because component renders fragment
【难得偷闲动动笔】开发问题记录（二）：Extraneous non-props attributes
qweasdzxcertdfgcvb的博客
02-09 4892
1.今天在用vue3时，遇到了一个警告： Extraneous non-props attributes (class) were passed to component but could not be automatically inherited because component renders fragment or text root nodes. 问题的原因是因为传递了没有解析定义的属性，一般情况下是class。 经过检查果然是class没有定义 收工 ...
【vue】[Vue warn]: Extraneous non-props attributes (class) were passed to component but could
J_Giving的博客
09-28 1万+
检查封装的vue组件或者使用的第三方组件，是否将组件暴露在了最外层，如果暴露在最外层，则在引用的时候就是报该错
Vue3报错：Extraneous non-props attributes (style) were passed to component but could not be automatical
海风依旧
11-30 1万+
Vue3报错：Extraneous non-props attributes (style) were passed to component but could not be automatically inherited because component renders fragment or text root nodes.
解决 Vue 3 中 ＜transition-group＞ 组件报错的非 props 属性传递问题
专注于深入研究多种编程语言，以实战为导向，逐步拓展开发技能，提升工程化编码和思维能力，展现无敌技术实力。
12-08 1735
在使用 Vue 3 中的 组件时，尝试传递非 props 属性（如 mode）可能导致组件报错。本文将探讨出现这个问题的原因，并提供了多种解决方案，包括移除不必要的属性、全局配置、使用 组件等。同时介绍了 Vue 3 过渡系统的改变以及避免类似问题的建议，旨在帮助开发者更好地使用 Vue 3 的过渡功能。
[Vue warn]: Extraneous non-props attributes (class)
qq_43592064的博客
11-21 5748
[Vue warn]: Extraneous non-props attributes (class)
编译vue2.x项目中报错ReferenceError: globalThis is not defined
06-07
这个错误通常是由于你的代码中使用了 `globalThis`，但是你的环境并不支持它（比如 Node.js 的版本太低或是浏览器不支持）。 要解决这个问题，你可以使用以下方法之一： 1. 升级你的环境到支持 `globalThis` 的版本。比如升级 Node.js 到 12 或以上的版本。 2. 在你的代码中添加以下代码来模拟一个 `globalThis` 对象： ```js // 在浏览器中 var globalThis = window || self; // 在 Node.js 中 var globalThis = global; ``` 这个代码会检查当前环境是否存在 `window` 或 `self` 对象（浏览器环境），或者 `global` 对象（Node.js 环境），如果存在，则将其赋值给 `globalThis` 对象。 这样，你就可以在不支持 `globalThis` 的环境中使用 `globalThis` 对象了。 希望这可以帮助你解决问题！

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值