组件的显示与隐藏（两种方案）

方法1：$route.path 判断html部分路由配置.我们可以根据组件身上的$route获取当前的路由信息，通过路由的路径判断我们的组件是否显示或者隐藏例如：top是我们在某个页面上显示或者隐藏的导航组件如果我们的home组件和user组件需要显示我们的top组件，我们可以用$route.path 判断我们当前所跳转到页面，如果等于则显示top组件，否则不显示方法2：使用路由元件信息以下的v

花田的墙

2641人浏览 · 2023-05-29 22:54:41

花田的墙 · 2023-05-29 22:54:41 发布

方法1：$route.path 判断

html部分

路由配置

.我们可以根据组件身上的$route获取当前的路由信息，通过路由的路径判断我们的组件是否显示或者隐藏

例如：top是我们在某个页面上显示或者隐藏的导航组件

如果我们的home组件和user组件需要显示我们的top组件，我们可以用$route.path 判断我们当前所跳转到页面，如果等于则显示top组件，否则不显示

方法2：使用路由元件信息

以下的vue官方文档的介绍

ok下面我门看实际用法

我们在配置路由时添加meta属性

设置布尔值true 或者false

我们在组件中v-show绑定$route.meta.xxx 如果值为true则显示top组件，false隐藏top组件

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^

Vue

echarts堆叠柱状图

Vue

Error in v-on handler: "TypeError: Cannot read properties of undefined (reading 'current')"

这是一个 Vue.js 错误，报错信息提示在 v-on 处理程序中出现了错误：“TypeError: Cannot read properties of undefined(读取 'current')”。这意味示在您的代码中，试图读取一个未定义的变量 'current'。您需要检查您的代码，确保 'current' 已正确定义并初始化。...