Vue学习-1（7）将Nav组件做成全局组件

去看去思考 去看去思考 博客等级 墨衍会员 · AI 创作全网分发 墨衍智能分发 本文由作者通过墨衍一键同步至各平台 1分发平台 300+累计阅读 305平均单平台 已同步平台 优快云 微信公众号 微博 知乎 掘金 百家号 博客园 抖音 小红书 你的文章也可以这样分发 墨衍会员 ¥399起/年，写一次发全网 我也要 码龄6年
关注
原创 最新推荐文章于 2026-05-26 11:41:32 发布 305 阅读 AI 写同款· GEO 优化 ›
Vue2.0——组件 组件是可复用的 Vue 实例,主要用于开发中 具有相同特征不同数据的模块 把它集成为一个组件 供重复利用组件的属性不能用大写字母 组件的名字可以用驼峰命名法,但是使用的时候必须用连字符 全局注册的组件使用时不能使用单标签(不会报错,但是只能使用一次 多次使用只显示第一个)注册的组件不要跟系统标签同名一个vm实例可以有多个局部组件,但是只能供当前vm实例使用不能用外部data里面的数据，因为他是Vue全局的。必须要在过滤器中声明：而且必须在new Vue前申明，不然Vue里面的函数都加载完了还没有找到数据，就 阅读详情

  • webstorm快捷引入
    image-20201228170632336
    image-20201228170733525

  • main.js全局局引用(tab)
    image-20201228170906125

  • 引入位置
    image-20201228171054649

  • 引入方法
    image-20201228171209581

收录于
vue学习

当前文章被收录于：

vue学习
18 篇文章 0 人学习
订阅专栏 查看详情
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
项目总结：vue.js2.5饿了么APP（3）主要组件实现 - 购物车相关组件（上） 说明：本总结来源于慕课网 @ustbhuangyi老师的课程《Vue.js2.5+cube-ui重构饿了么App》课程，本博客做了项目总结梳理便于回顾，需要学习的伙伴可以移步学习。与君共勉！ 之前章节传送：项目总结：vue.js2.5饿了么APP（1）概述+项目准备 项目总结：vue.js2.5饿了么APP（2）主要组件实现 Goods组件是整个项目最复杂的部分。有一个商品列表，可以显示商品的分类，左右是可以联动的，底部有一个购物车组件。 ... 阅读详情

相关推荐

vue实现nav导航栏的方法

主要为大家详细介绍了vue项目nav导航栏的实现方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

Vue:Nav导航栏和标签页联动

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档。

qq_45061461的博客 1361

数据质量管理的一些思考

背景 在近期的项目当中，我们为客户落地实施了数据资产平台。随后，在数据平台中接入了客户子公司的一个业务系统的明细数据。客户希望在我们的数据平台上通过数据探索和数据分析，来挖掘一些业务价值和业务创新点。 当我们拿到数据开始进行一些初步探索的时候，发现导入平台的数据质量存在一定的问题：例如一些用于数据分析的关键字段的值为空、一些本应该有主从关系的数据对应不上、数据分类混乱等。这些问题直接影响到了对...

IDEAL Garden 1万+

用vue写轮子的一些心得（六）——nav导航栏组件

需求分析 支持横向导航竖向导航； 支持导航click展开下拉列表； 支持下拉列表click展开二级下拉列表，可任意层级； 配有展开动画； 方法实现 1、定义组件： 在html中定义 t-nav组件定义为最外层导航栏包裹器，nav-item组件包裹每一项导航名字，并且每个nav-item组件都声明一个name，用以标识每一项导航。sub-nav组件包裹含有下拉列表的导航项。 <t-nav class="box" :selected.sync="selected" vertical.

阿嚏乱码的地方 3953

Western blot (WB) 灰度分析进阶指南：ImageJ 高效定量技巧与实战优化

本文详细介绍了使用ImageJ进行Western blot灰度分析的进阶技巧，包括批量处理、背景校正和疑难条带处理等实战优化方法。通过自动化宏脚本和动态背景校正，显著提升分析效率和准确性，特别适合科研人员处理复杂WB数据。

weixin_42557830的博客 902

国产系统迁移实战：在银河麒麟V10上搞定Wine32位支持，让老Windows软件跑起来

本文详细介绍了在银河麒麟V10操作系统上构建Wine32位支持的全过程，帮助用户解决Windows应用迁移难题。从系统架构差异分析到Wine环境配置，再到实战应用部署与优化，提供了一套完整的解决方案，确保老Windows软件在国产系统上稳定运行。

weixin_32288959的博客 649

vue中nav导航栏的排他思想+节流思想（lodash库）

排他思想： 选择nav导航栏中一个子类，变色，并让其他子类不变色 节流思想和防抖： 节流：间隔时间，用户操作频繁，但是把频繁操作变为少量操作，少量操作还在间隔时间后执行，间隔之间内不会执行 例如王者技能：频繁点击，有时间做间隔，点击后，必须等这么一段时间才能使用 防抖：规定时间，用户操作频繁，但是只是执行最后一次，之前的回调会取消 例如王者回城：频繁点击，但是只是规定时间内最后一次点击才成功，之间

weixin_49931650的博客 842

LDA主题模型简介及Python实现

一、LDA主题模型简介 LDA主题模型主要用于推测文档的主题分布，可以将文档集中每篇文档的主题以概率分布的形式给出根据主题进行主题聚类或文本分类。 LDA主题模型不关心文档中单词的顺序，通常使用词袋特征（bag-of-word feature）来代表文档。词袋模型介绍可以参考这篇文章：文本向量化表示——词袋模型 - 知乎 了解LDA模型，我们需要先了解LDA的生成模型，LDA认为一篇文章是怎么形成的呢？ LDA模型认为主题可以由一个词汇...

weixin_41168304的博客 20万+

vue中NavMenu导航菜单刷新高亮，上一级常亮实现

而一级菜单栏由activeMenu来自定义高亮，使得activeMenu配置和一级菜单的index属性中的配置一直一致，这样接口文档内的纵向菜单在切换的时候就不会影响到一级主菜单的高亮了。通过路由router设置路由元信息（meta）记录地址，在MenuNav中读取meta中设置的信息，匹配el-menu-item中index的值，来解决刷新或地址改变造成的一些导航栏高亮问题。在当前页面中还嵌入一个纵向菜单，这个纵向菜单高亮代表这个页面显示不同的tab（刷新页面后依旧保持高亮）在菜单中，存在多级带单。

coinisi_li的博客 1887

YOLO11 改进 - C2PSA | C2PSA融合HEWL(高频增强小波层)：小波逆变换+双通道注意力增强+高频显式增强 | TGRS 2026

本文介绍了高频增强小波层（HEWL），一种专为解决红外小目标检测中边缘退化与语义模糊问题设计的上采样模块。该方法结合小波逆变换与交替通道注意力（ALCA），通过显式增强高频细节并优化特征融合，实现精准的边缘重建与语义对齐。我们将 HEWL 融入 PSABlock 结构构建了 C2PSA_HEWL 模块，并成功集成进 YOLO11 的骨干网络，替代原有的 C2PSA 模块。实验证明，结合 HEWL 的 YOLO11 在检测任务中表现优异，有效提升了模型对细节特征的捕捉能力。

魔改工程师的博客 103

使用 Python 爬虫抓取 IMDb 电影信息 - 评分、评论与基本信息抓取教程

本文介绍了如何使用 Python 爬虫技术抓取 IMDb 电影评分、评论和基本信息。我们分别展示了通过IMDb API和两种方法抓取数据，并进行了数据存储、分析与可视化。在未来，我们还可以基于这些数据开发电影推荐系统、情感分析工具等，进一步丰富电影数据的应用场景。通过这些实践，您不仅学会了如何抓取和存储数据，还可以通过这些基础来构建自己的数据分析应用，获取更丰富的电影数据。

2201_76125261的博客 601

前端Vue自定义顶部导航栏navBar 导航栏搜索框searchBar 导航栏右侧菜单按钮button

### 使用方法```使用方法-- icon: 右侧菜单图标 @searchClick：搜索点击 @rigIconClick：右侧菜单点击 -->```#### HTML代码实现部分```html-- icon: 右侧菜单图标 @searchClick：搜索点击 @rigIconClick：右侧菜单点击 -->-- proList: 条目数组数据 goProDetail:条目点击事件跳转（实现了点击条目数据传值）-->

chenchuang0128的博客 5032

13、使用 Mathematica 撰写文本

本文详细介绍了如何使用 Mathematica 进行文本撰写与处理。内容涵盖文本输入、格式设置、结构化排版、超链接插入、翻译与拼写检查工具的使用，以及将笔记本导出为多种格式（如 PDF、HTML、LATEX 和 RTF）的方法。通过实例演示了创建专业文档的完整流程，包括样式设置、公式推导、标题编号、页眉页脚配置等操作。适合希望利用 Mathematica 编写学术论文、技术报告或教学资料的用户参考。

sony5的博客 208

全局组件和局部组件

1.全局组件和局部组件的区别 全局组件：只需要在main.js中导入一次，整个项目都可以直接使用（在main.js中导入） 局部组件：用一次 导一次 （在用到的地方导入） 2.局部组件导入步骤 // 3部曲 //[1]导入子组件 import Register from './Register.vue' ​ export default { //[2]注册子组件components: { Register }, compontents: { Register }, ...

qq_43260366的博客 4099

（四）C++自制植物大战僵尸游戏启动流程

鼠标左键单机VS2022上方工具栏中进行项目启动。第一次启动项目需要编译项目中所有代码文件，编译生成需要一定的时间。不同性能的电脑需要消耗的时间差别可能较大，通常在几分钟到几十分钟之间。编译成功后会自动启动运行游戏。qi编译成功后自动启动运行游戏如下图。

尔灵尔亿的博客 2467

蓝牙模块HM-10手册

蓝牙模块HM-10手册，该手册对蓝牙模块HM-10进行了详细的介绍和使用方法以及一些AT指令。

VUE中如果让全局组件在某一页面不显示

在使用 Vue 开发项目时，为了提高开发效率和减少重复代码，我们通常会使用全局组件。全局组件能够在整个项目的各个页面中使用，使得组件的复用更加方便。然而，有时候我们在某个页面中可能不希望显示全局组件。本篇文章将介绍如何在设置了全局组件的情况下，在某个页面中不显示全局组件，优化项目的组件加载和页面渲染。

qq_52799985的博客 1625

pscad IEEE标准系统搭建说明

pscad IEEE标准系统搭建说明，包含典型的IEEE 9节点、14节点、30节点、39节点和118节点系统。内含标准测试系统的原始数据和潮流结果。

vue 组件全局封装_vue封装全局组件

首先写是需要封装的组件NavBarTitle.vueleft-arrow@click-left="onClickLeft">{{NavBarTitle}}.NavBarTitle .van-nav-bar__text,.van-nav-bar .van-icon{color:#333333;}.NavBarTitle /deep/ .van-nav-bar__title{font-size:...

weixin_29534143的博客 622

jdk-8u144-linux-x64.tar.gz.

该资源为搭建Linux系统Java环境用，资源的后缀为tar.gz格式的压缩包

TMS_WebGMaps_1.9.8.0_Full_Source

TMS_WebGMaps_1.9.8.0_Full_Source 全源码 delphi cbuilder

vue 注册全局组件

一个组件，想在很多页面都可以这么使用，把它封装成一个全局组件，就避免了在每个要使用的文件中本地注册此组件的麻烦。

且听风吟的博客 1122

全局组件注册uniapp+vue3,defineExpose暴露子组件属性，父组件中使用

分为1、全局注册插件，可以类似elementui中的警告提示，在js代码中调用进行显示和隐藏。可用于加载的loading，某些弹窗提示，无需写在template中，按js逻辑使用。2、nav.js,注册全局组件，写了两种，1、插件形式可以用js调用，2、组件形式可以在template内使用。2、全局批量注册组件，就在template中使用组件，用于固定样式。方法调用时执行，并接收 Vue 应用实例作为参数。方法的对象，该方法会在插件被。4、使用，在index.vue中。1、组件nav.vue。

MarchS的博客 963

vue——全局/局部组件、单文件组件、组件的属性、全局样式、局部样式

全局/局部组件、单文件组件、组件的属性、全局样式、局部样式、组件基础面试题

qq_56668869的博客 2023

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

下载的一个vue构建的后台管理系统，导航栏是一个侧边栏，想在头部里面加一个导航 先是导入要使用的组件 import Hamburger from '@/components/Hamburger' import Nav from '@/components/Nav/index.vue' //自己新建的 然后在 components 里面写入该组件 components: { Ha...

夜听雪的博客 1万+

vue2中注册全局组件

import NAV from ""(组件地址)

pzpcxy520的博客 505

vue-nav-tabs: 基于Vue.js的标签页组件

vue-nav-tabs: 基于Vue.js的标签页组件 1. 项目介绍 vue-nav-tabs 是一个基于 Vue 框架开发的轻量级标签页组件库。它设计用于提供一个简单易用且高度可定制化的标签切换功能，适用于各种Web应用界面中。该组件不仅支持基础的标签切换操作，还提供了丰富的扩展性和自定义选项，使得开发者能够轻松地集成到现有的项目结构中。 2. 项目快速启动 安装 首先确保你的环境中已经安装...

gitblog_00352的博客 848

推荐项目：Vue-Bilibili-Nav

推荐项目：Vue-Bilibili-Nav 项目简介 是一个基于 Vue.js 的哔哩哔哩导航组件库，旨在帮助开发者快速构建具有哔哩哔哩风格的导航栏。这个项目由 NightCatSama 开发并维护，它提供了丰富的交互效果和自定义选项，使得在你的应用中实现类似的导航功能变得轻而易举。 技术分析 基于 Vue.js Vue.js 是一款流行的前端框架，以其易于学习、高性能和组件化的特性受到广泛欢迎。...

gitblog_00041的博客 414

Vue路由配置、网络请求访问框架项目、element组件介绍学习

本文会讲述：路由配置；网络请求访问框架项目；element组件介绍。

攸攸太上的博客 3529
上一篇： Vue学习-1（6）使用VueRouter(对比reactRouter...待续)
下一篇： Vue学习-1（8）VueRouter 404 页面
点赞 0
评论 0
书签 书签 0
去看去思考
去看去思考
博客等级 码龄6年 1粉丝 21原创
+ 关注 专栏目录 订阅专栏
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值