vue3 Extraneous non-props attributes (modelValue) were passed to component but could not be automati

Missying55

8455人浏览 · 2022-11-07 16:14:01

Missying55 · 2022-11-07 16:14:01 发布

vue3 控制台报错如下图：

在这里插入图片描述

代码书写如下

在这里插入图片描述

原因：

1.一个组件可能有多个根节点，请确保组件在单一根节点下
2.外部组件不要直接放在template下，最外层加div包裹

修改代码图二,将add-applicant放进right-slider组件，控制台不再报错，外层组件也可以正常加载出来，但是包裹的add-applicant组件加载不出来（此操作如果没有嵌套，修改后是可以实现的，如果有嵌套，不要做修改，请接着往下看~）

在这里插入图片描述

最后决定从根本上解决问题，也就是根组件rightSlider,加上插槽slot，组件里就能很愉快的放在外面了

在这里插入图片描述

View Design

基于 Vue 的企业级 UI 组件库和中后台系统解决方案，为数万开发者服务。

更多推荐

Element UI组件介绍

简介element ui 就是基于vue的一个ui框架,该框架基于vue开发了很多相关组件,方便我们快速开发页面。1、安装Element UI，通过vue脚手架创建项vue init webpack element(项目名)2、在vue脚手架项目中安装elementui# 1.下载elementui的依赖npm i element-ui -S# 2.指定当前项目中使用elementuiimport