我的编程空间,编程开发者的网络收藏夹
学习永远不晚

vue组件引用另一个组件出现组件不显示的问题及解决

短信预约 -IT技能 免费直播动态提醒
省份

北京

  • 北京
  • 上海
  • 天津
  • 重庆
  • 河北
  • 山东
  • 辽宁
  • 黑龙江
  • 吉林
  • 甘肃
  • 青海
  • 河南
  • 江苏
  • 湖北
  • 湖南
  • 江西
  • 浙江
  • 广东
  • 云南
  • 福建
  • 海南
  • 山西
  • 四川
  • 陕西
  • 贵州
  • 安徽
  • 广西
  • 内蒙
  • 西藏
  • 新疆
  • 宁夏
  • 兵团
手机号立即预约

请填写图片验证码后获取短信验证码

看不清楚,换张图片

免费获取短信验证码

vue组件引用另一个组件出现组件不显示的问题及解决

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

下载的一个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 里面的内容

然后在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 class="lazy" data-src\layout\components\Navbar.vue:44:5:
  43 |     Hamburger,
> 44 |     Nav
     |     ^
  45 |   },

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

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

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

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

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

以上为个人经验,希望能给大家一个参考,也希望大家多多支持编程网。

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

vue组件引用另一个组件出现组件不显示的问题及解决

下载Word文档到电脑,方便收藏和打印~

下载Word文档

猜你喜欢

vue组件引用另一个组件出现组件不显示的问题怎么解决

这篇文章主要介绍了vue组件引用另一个组件出现组件不显示的问题怎么解决的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇vue组件引用另一个组件出现组件不显示的问题怎么解决文章都会有所收获,下面我们一起来看看吧。组
2023-06-30

vue3中echarts的tooltip组件不显示问题及解决

这篇文章主要介绍了vue3中echarts的tooltip组件不显示问题及解决方案,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
2022-11-13

vue子组件created方法不执行问题及解决

这篇文章主要介绍了vue子组件created方法不执行问题及解决,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
2022-11-13

如何解决vue集成sweetalert2提示组件的问题

这篇文章主要介绍如何解决vue集成sweetalert2提示组件的问题,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!一、项目集成官网链接:https://sweetalert2.github.io案例1. 引入方式
2023-06-25

vue子组件封装弹框只能执行一次的mounted问题及解决

这篇文章主要介绍了vue子组件封装弹框只能执行一次的mounted问题及解决方案,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
2023-03-02

微信小程序使用picker组件出现问题怎么解决

本篇内容主要讲解“微信小程序使用picker组件出现问题怎么解决”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“微信小程序使用picker组件出现问题怎么解决”吧!一、picker基本概念先来看一
2023-07-04

编程热搜

目录