vue报错1：单个vue组件引入无错误，同时引入两个vue组件就会报错

最新推荐文章于 2024-06-05 11:00:07 发布
最新推荐文章于 2024-06-05 11:00:07 发布
阅读量2.8k 收藏
点赞数 1
分类专栏： vue 文章标签： 前端 vue.js vue.js新手错误
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_40667613/article/details/86524884
版权

报错背景：
单个vue组件引入无错误，同时引入两个vue组件就会报错。错误为图1
单个vue组件引入无错误，同时引入两个vue组件就会报错
图1
错误文件代码：为图2
单个vue组件引入无错误，同时引入两个vue组件就会报错
测试：
我测试单个引入一个组件。两个组件单独引入都为成功。

解决结果：
在两组件加一层div，让他们属于第二级别。这样就不会出错。代码如图3
单个vue组件引入无错误，同时引入两个vue组件就会报错
最终结果
在这里插入图片描述

秋宁去吃饭
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue打包后样式文件引用加载顺序错误，导致样式错乱
希望能找到你的答案
09-21 1万+
项目开发环境下，运行应用程序样式正常，但是通过npm run build打包后，放到服务器上，再次访问，就会出现css错乱，自定义的css文件被其它组件的样式给覆盖了，比如引用了iview.css样式，就会被此文件覆盖。 解决方案： import Vue from 'vue'; import 'iview/dist/styles/iview.css'; import App from './...
加载多个Vue版本导致的bug
weixin_30652271的博客
04-02 259
团队自己开发的一个UI基础库依赖于Vue^2.5.16, 开发业务项目的时候由于Vue已经更新到2.6.10了，业务项目里面的Vue依赖是~2.5.16,所以导致安装项目依赖时，UI基础库安装了2.6.10版本，项目库安装了2.5.21版本，这样在运行时加载了两个版本的Vuejs库。updateChildComponent这个函数会在给实例的$attrs和$listener属性赋值，处理...
vue动态加载组件import引入组件找不到组件（Error: Cannot find module）
最新发布
宁波阿成的博客
06-05 867
vue动态加载组件import引入组件找不到组件（Error: Cannot find module）
vue从一个页面引入另一个页面
热门推荐
qq_41377857的博客
11-12 4万+
1.先写好一个demo页面 demo.vue <template> <div> <h1>11111</h1> </div> </template> <script> export default {} </script> <style
vue官网学习遇到的组件注册不正确问题
归零
12-15 1847
在学习vue时没有深入理解vue，所以在写代码时遇到了一个低级的错误，其错误信息报错如下： 以上报错的意思是： todo-test组件没有注册正确 HTML代码： css代码： 解决的方法： 更改vue实例化和组件注册的顺序即可解决 这里的主要问题时对于组件的注册顺序没有考虑好，应该先完成组件的注册后再实例化vue对象 ...
Vue父组件主动获取子组件的值和方法
冯岳松的博客
10-28 3921
在父组件使用子组件的代码中，为子组件加上ref="name(自己设置一个名称)" 然后在代码中： this.$refs.name(你设置的名字).data this.$refs.name(你设置的名字).method() 注意：如果父组件以循环的方式生成子组件，如： <component ref="getParameters" v-for="(item, index) in layers" :is="item.name"
vue-storybook：自定义Vue单个文件组件的块
02-06
故事书 Vue单个文件组件的自定义块，... Webpack加载器+帮助程序脚本，可让您使用自定义的块修饰已存在的Vue单个文件组件（SFC），该块会自动翻译成风格的故事。 你好世界的例子 回购： : < my-button : disabled
vue-popper：基于VueJS popover组件的popper.js
02-06
vue-popperjs 基于 popover组件 例 安装 CDN 推荐： : ，它将在发布到npm时立即反映最新版本。 您也可以在浏览npm软件包的源代码。 NPM npm install vue-popperjs --save 纱 yarn add vue-popperjs 凉亭 bower ...
vue-run:从CLI运行Vue单个文件组件
05-01
vue运行从CLI运行Vue单个文件组件 当前是在制品，请给我们加星号并关注一下/这仅适用于Presentational组件安装npm install vue-run -g用法在具有单个文件组件的目录中时vsr特征从目录运行单个文件组件快速向正在运行...
vue单个组件实现无限层级多选菜单功能
08-27
Vue 单个组件实现无限层级多选菜单功能 在 Vue 框架中，实现无限层级多选菜单功能是一个常见的需求。下面我们将介绍如何使用 Vue 单个组件实现这个功能。 首先，让我们了解一下无限层级多选菜单的需求。无限层级...
详解VUE中常用的几种import（模块、文件）引入方式
08-27
在Vue项目中，import语句是非常常用的，它可以帮助我们引入不同的模块、文件、组件、插件等，以满足项目的需求。下面是详解Vue中常用的几种import引入方式。 1. 引入第三方插件 在Vue项目中，我们经常需要引入第三...
vue开发的项目中遇到的警告，报错，配置项目文件等合集（长期更新）
weixin_33796205的博客
04-22 830
1. Vue组件里面data()里面没有return时触发错误：Vue components Cannot read property '__ob__' of undefined 这个警告不解决会触发错误： 2. Vue项目开启局域网访问 有的项目比如移动端需要在手机上调试，这个时候需要用局域网开启在手机上查看。 解决方法：在配置文件加 --host 0.0.0.0 或者： ...
如何在另一个vue文件调用另一vue文件的方法
m0_73701465的博客
01-14 1049
然后在AddGood.vue里可以这样调用，比如我们需要在这个方法执行之后去调用getGoodData()方法，我们就只需要改变对象isReloadGood的值，当它为true时，就去调用它。比如有两个vue文件LoadGood.vue和AddGood.vue两个文件，现在我们要在AddGood.vue文件中去使用LoadGood,vue里的一个方法。我们需要在AddGood.vue里去调用它，那么我们就只需要定义一个对象，然后用watch去监听改变该对象的值来触发该方法。
vue页面存在两个相同元素设置失效问题
FighterLiu的专栏
05-21 658
项目场景： 在项目中有这样一个需求，在一个页面中会展示审核通过数据和待审核的数据。通过Tabs标签页进行数据切换，列表中都有复选框，需要在待审核的数据中禁用某些复选框。 问题描述 在代码中复选框通过设置列的 type=“selection”，在通过selectable方法把数据为2016-05-02的复选框设置为不可勾选，具体代码如下： <template> <el-tabs v-model="activeName"> <el-tab-pane label="审核
Vue多个父组件引用同一个子组件，子组件的$parent指向问题
m0_73095627的博客
10-16 1879
Vue多个父组件引用同一个子组件，子组件的$parent指向问题
vue3.0深入v-model以及使用多个v-model
weixin_43845137的博客
03-16 4975
目录vue3.0深入v-model以及使用多个v-modelv-model原理v-mode的实现 父子组件的通信父组件 Main.vue子组件 Dialog.vuev-model 使用多个main.vuedialog.vuev-model 自定义修饰符给v-model自定义修饰符main.vuedialog.vue vue3.0深入v-model以及使用多个v-model v-model原理 原理：其实是一个语法糖 通过props 和 emit组合而成的语法糖 默认值的改变 prop：value -&g
.vue文件引入子组件报错 (vue3+typescript+@vue/cli5+系列问题总结)
王维璋
05-15 6180
项目技术栈： 脚手架：@vue/cli 5.0.4 vue：vue 3.2.13 typescript：4.5.5 sass：1.32.7 sass-loader：12.0.0 背景： .vue文件组件中引入子组件报错(并不是所有的子组件都报错。编译不报错，不影响项目运行) 问题详情： 1、父组件中引入两个子组件，只有一个报错 错误信息： 文件“/Users/wangweizhang/clie...
一文解决Vue所有报错【持续更】
7me
03-06 4976
Vue是一个流行的前端框架，许多web开发人员使用Vue来构建他们的应用程序。然而，正如任何其他框架一样，Vue也可能会发生错误。在这篇技术文章中，我们将探讨Vue常见的报错以及如何解决它们。
同一页面多次引用同一组件
Summer_JK的博客
05-18 2590
同一页面多次引用同一组件实现日期默认值 需求：在一个页面内引入两次form表单组件，在tab切换时，tab1默认近一周的日期，tab2默认近一个月的日期 子组件： <template> <div> <el-form :inline="true" :model="form" class="demo-form-inline"> <el-form-item> <el-select v-model="form.time"&
webpack打包单个vue文件报错：Cannot read properties of undefined (reading 'styles')
05-22
这个错误通常是因为缺少Vue Loader插件导致的，Vue Loader可以帮助Webpack将.vue文件转换为JavaScript模块。你可以按照以下步骤来解决这个问题： 1. 安装Vue Loader插件： ``` npm install vue-loader vue-...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值