摘要: 编程式导航:通过 JS 的方式实现路由跳转 如何实现点击按钮跳转? 一、不传参: 1. 通过 path 路径跳转(简易方便) ① 简写: 按钮的点击事件中写 this.$router.push ( ' /路由路径 ' ) 比如:this.$router.push ( ' /search ' ) ② 阅读全文
posted @ 2023-10-11 21:32 1stzz1 阅读(56) 评论(0) 推荐(0) 编辑
摘要: 阅读全文
posted @ 2023-10-11 16:29 1stzz1 阅读(3) 评论(0) 推荐(0) 编辑
摘要: 问题描述:网页打开,url 默认是 / 路径,未匹配到组件时,会出现空白 解决:重定向 → 匹配 path 后,强制跳转 path 路径 语法:{ path : 匹配路径 , redirect : 重定向到的路径 } const router = new VueRouter({ routes: [ 阅读全文
posted @ 2023-10-11 16:26 1stzz1 阅读(71) 评论(0) 推荐(0) 编辑
摘要: vue-router 提供了一个全局组件 router-link(取代 a 标签) router-link 本质还是 a 标签 router-link 功能: ① 能跳转,配置 to 属性指定路径(必须),本质还是 a 标签,to 无需 # ② 能高亮,默认就会提供 高亮类名,可以直接设置高亮样式 阅读全文
posted @ 2023-10-11 14:26 1stzz1 阅读(63) 评论(0) 推荐(0) 编辑
摘要: Vue 中路由:路径 和 组件 的映射关系,根据路由就能知道不同的路径应该匹配渲染哪个组件 VueRouter 作用:修改地址栏路径时,切换显示匹配的组件 VueRouter 的使用步骤: 1. 五个固定步骤: ① 下载 VueRouter 模块到当前工程,版本 3.6.5(Vue2 对应的版本是 阅读全文
posted @ 2023-10-10 21:08 1stzz1 阅读(27) 评论(0) 推荐(0) 编辑
摘要: 插槽的作用:让组件内部的一些 结构 支持 自定义 应用场景 eg:将对话框封装成组件,对话框的内容部分不希望写死,希望能使用的时候自定义。 插槽的基本语法: 1. 组件内需要定制的结构部分 改用 <slot> </slot> 占位 2. 使用组件时,<MyDialog></MyDialog> 标签内 阅读全文
posted @ 2023-10-10 17:18 1stzz1 阅读(70) 评论(0) 推荐(0) 编辑
摘要: 自定义指令:自己定义的指令,可以封装一些 dom 操作,扩展额外功能 语法: (无论是全局方式定义指令 还是 局部方式定义指令,最终 只要把指令定义完成,页面当中用起来 只需要 eg : <input v-指令名 type = "text" > 。只要一绑上,在当前输入框被插入到页面当中的时候,就会 阅读全文
posted @ 2023-10-09 22:28 1stzz1 阅读(52) 评论(0) 推荐(0) 编辑
摘要: Vue 是异步更新 DOM 的,想要在 dom 更新完成之后做某件事,可以使用 $nextTick $nextTick:等 dom 更新后,才会触发执行此方法里的函数体 语法: this.$nextTick ( () => { // 业务逻辑 }) eg: this.$nextTick ( () = 阅读全文
posted @ 2023-10-09 22:01 1stzz1 阅读(7) 评论(0) 推荐(0) 编辑
摘要: 作用:利用 ref 和 $refs 可以用于 获取 dom 元素,或 组件实例 特点: 查找范围:当前组件内(更精确稳定) 语法: ① 获取 dom: 1. 给目标标签添加上 ref 属性 (<div ref = " chartRef "> 我是渲染图表的容器 </div>) 2. 在恰当时机,通过 阅读全文
posted @ 2023-10-09 21:32 1stzz1 阅读(14) 评论(0) 推荐(0) 编辑
摘要: 作用:可以实现 子组件 与 父组件数据 的 双向绑定,简化代码 特点:prop 属性名可以自定义,非固定为 value 本质:就是 :属性名 和 @update : 属性名 的合写 应用场景:封装弹窗类的基础组件,visible 属性 true 显示,false 隐藏 eg: 父组件: <BaseD 阅读全文
posted @ 2023-10-09 21:01 1stzz1 阅读(46) 评论(0) 推荐(0) 编辑