vue组件冲突之引用另一个组件出现组件不显示的问题


Posted in Vue.js onApril 13, 2022

组件引用另一个组件出现组件不显示

下载的一个vue构建的后台管理系统,导航栏是一个侧边栏,想在头部里面加一个导航

先是导入要使用的组件

import Hamburger from '@/components/Hamburger'
import Nav from '@/components/Nav/index.vue' //自己新建的

然后在 components 里面写入该组件

components: {
    Hamburger,
    Nav  //自己定义的
  }

最后在模板 tamplete 中使用

<template>  
  <div class="navbar">
    <breadcrumb class="breadcrumb-container" />
    <nav /> 
  </div>  
</template>

但是在检查页面的时候发现 页面里面并没有显示 Nav/index.vue 里面的内容

vue组件冲突之引用另一个组件出现组件不显示的问题

然后在cmd上面发现报错,说Nav已定义 未使用

Module Warning (from ./node_modules/eslint-loader/index.js):
error: The "Nav" component has been registered but not used (vue/no-unused-components) at src\layout\components\Navbar.vue:44:5:
  43 |     Hamburger,
> 44 |     Nav
     |     ^
  45 |   },

又试了半天也不知问题出在哪里,然后想着首字母大写有没有,就试了一下,发现居然显示了

vue组件冲突之引用另一个组件出现组件不显示的问题

但是其他的组件都是小写的就可以,不知道为什么

vue声明了一个组件,但是没有显示

声明了一个组件,但是页面不显示,原来问题出在这。套

vue组件冲突之引用另一个组件出现组件不显示的问题

原来我们需要先声明一个Vue的实例,以及把我们自定义的组件放在标签里面。

vue组件冲突之引用另一个组件出现组件不显示的问题

Vue.js 相关文章推荐
vue element-ul实现展开和收起功能的实例代码
Nov 25 Vue.js
vue3.0中setup使用(两种用法)
Dec 02 Vue.js
Vue实现点击当前行变色
Dec 14 Vue.js
Vue实现小购物车功能
Dec 21 Vue.js
手写Vue源码之数据劫持示例详解
Jan 04 Vue.js
vue实现按钮切换图片
Jan 20 Vue.js
vue keep-alive的简单总结
Jan 25 Vue.js
vue 组件基础知识总结
Jan 26 Vue.js
vue使用节流函数的踩坑实例指南
May 20 Vue.js
vue+springboot实现登录验证码
May 27 Vue.js
vue route新窗口跳转页面并且携带与接收参数
Apr 10 Vue.js
vue elementUI表格控制对应列
Apr 13 #Vue.js
vue项目打包后路由错误的解决方法
Apr 13 #Vue.js
vue的项目如何打包上线
vue2的 router在使用过程中遇到的一些问题
Apr 13 #Vue.js
vue+elementUI实现表格列的显示与隐藏
Apr 13 #Vue.js
如何优化vue打包文件过大
Apr 13 #Vue.js
使用vue判断当前环境是安卓还是IOS
Apr 12 #Vue.js
You might like
fckeditor上传文件按日期存放及重命名方法
2015/05/22 PHP
PHP中strtr与str_replace函数运行性能简单测试示例
2019/06/22 PHP
用js判断用户浏览器是否是XP SP2的IE6
2007/03/08 Javascript
Jquery + Ajax调用webService实例代码(asp.net)
2010/08/27 Javascript
有关于JS辅助函数inherit()的问题
2013/04/07 Javascript
原生javascript和jquery判断浏览器版本等信息
2013/07/04 Javascript
javascript:void(0)是什么意思示例介绍
2013/11/17 Javascript
多个checkbox被选中时如何判断是否有自己想要的
2014/09/22 Javascript
聊一聊jQuery插件uploadify使用方法
2016/08/24 Javascript
WebView启动支付宝客户端支付失败的问题小结
2017/01/11 Javascript
详解vue axios中文文档
2017/09/12 Javascript
JavaScript实现多文件下载方法解析
2020/08/07 Javascript
浅析python 中__name__ = '__main__' 的作用
2014/07/05 Python
编写Python脚本来实现最简单的FTP下载的教程
2015/05/04 Python
在python的类中动态添加属性与生成对象
2016/09/17 Python
利用Python抓取行政区划码的方法
2016/11/28 Python
深入浅析Python中list的复制及深拷贝与浅拷贝
2018/09/03 Python
Python文件读写保存操作的示例代码
2018/09/14 Python
python3.6环境安装+pip环境配置教程图文详解
2019/06/20 Python
用django-allauth实现第三方登录的示例代码
2019/06/24 Python
python利用蒙版抠图(使用PIL.Image和cv2)输出透明背景图
2020/08/04 Python
Python自动发送和收取邮件的方法
2020/08/12 Python
给老师的检讨书
2014/02/11 职场文书
机关单位人员学雷锋心得体会
2014/03/10 职场文书
募捐倡议书怎么写
2014/05/14 职场文书
消防安全宣传口号
2014/06/10 职场文书
预备党员2014年第四季度思想汇报范文
2014/10/25 职场文书
临时用工协议书范本
2014/10/29 职场文书
2014年药店店长工作总结
2014/11/17 职场文书
务工证明怎么写
2015/06/18 职场文书
学校远程教育工作总结
2015/08/11 职场文书
导游词之大雁塔景区
2019/09/17 职场文书
使用这 6个Vue加载动画库来减少我们网站的跳出率
2021/05/18 Vue.js
如何用python清洗文件中的数据
2021/06/18 Python
MySQL 四种连接和多表查询详解
2021/07/16 MySQL
升级 Win11 还是坚守 Win10?微软 Win11 新系统缺失功能大盘点
2022/04/05 数码科技