![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
小胡小胡秃头怪物
这个作者很懒,什么都没留下…
展开
-
Vue编程式路由API
this.$router.push(path) //相当于点击路由链接(后退1步,会返回当前路由界面) this.$router.replace(path) //用新路由替换当前路由(后退一步,不可返回到当前路由界面) this.$router.back() //后退回上一个记录路由 this.$router.go(n) //参数n指定步数 this.$router.go(-1) //后返回上一个记录路由 this.$router.go(1) //向前进下一个记录路由 ...原创 2022-03-14 12:57:21 · 1465 阅读 · 0 评论 -
Vue中的全局事件总线
1.一种组件间的通信方式,适用于任意组件间通信 2.安装全局事件总线: new Vue({ .... beforeCreate(){ Vue.prototype.$bus = this //安装全局事件总线,$bus就是当前应用的vm }, .... }) 3.使用事件总线: 1.接收数据:A组件想接收数据,则在A组件中给$bus绑定自定义事件,事件的回调留在A组件自身 methods(){ demo(data){.....} } ..... mounted(){ this.原创 2022-03-02 09:34:44 · 509 阅读 · 0 评论 -
Vue中组件的自定义事件
1.一种组件中的通信方式,适用于:子组件===>父组件 2.使用场景:A是父组件,B是子组件,B想给A传数据,那么就要在A中给B绑定自定义事件(事件的回调在A中 事件的回调留在父组件中) 3.绑定自定义事件: 1)第一种方式,在父组件中:<Demo @zidingyi="test"/>或者<Demo v-on:zidingyi="test"/> 2)第二种方式,在父组件中: <Demo ref="demo"> .............. mount.原创 2022-03-02 09:01:24 · 329 阅读 · 0 评论 -
Vue中vm的生命周期
将要创建 ===> 调用beforeCreate函数 创建完毕 ===> 调用 created函数 将要挂载 ===> 调用beforeMount函数 (重要)挂载完毕 ===> 调用mounted函数 (重要的钩子) 将要更新 ===> 调用beforeUpdate函数 更新完毕 ===> 调用updated函数 (重要)将要销毁 ===> 调用beforeDestory函数 (重要的钩子) 销毁完毕 ===> 调用des...原创 2022-01-07 10:55:33 · 134 阅读 · 0 评论 -
Vue中的过滤器
过滤器: 定义:过滤器就是对要显示的数据进行特定格式化再显示(适用于一些简单逻辑的处理) 语法: 1.注册过滤器: Vue.filter(name,callback) 或 new Vue{filters:{}} 2.使用过滤器:{{ xxx | 过滤器名}} 或 v-bing:属性 = " xxx | 过滤器名 " (1)过滤器也可以接受额外参数、多个过滤器也可以串联 (2)并没有改变原本的数据,是产生新的对应的数据 ...原创 2022-01-05 10:41:28 · 553 阅读 · 0 评论 -
Vue收集表单数据
收集表单数据: (1)若 <input type = "text"/> 则v-model收集的是value值,用户输入的值就是value值 (2)若 <input type = "radio"/> 则v-model收集的是value值,并且要给标签配置value值 (3)若 <input type = "checkbox"/> 1.没有配置input的value属性,那么收集的就是checked(勾选 or 未勾选 都是布尔值) 2.配置inpu原创 2022-01-05 10:14:49 · 361 阅读 · 0 评论 -
Vue监视数据的原理
1.Vue会监视data中所有层次的数据。 2.如何监测对象中的数据? 通过setter实现监视,且要在new Vue时就传入要监测的数据。 (1)对象中后追加的属性,Vue默认不做响应式处理 (2)如需给后添加的属性做响应式,请使用如下API: Vue.set(target, propertyName/index, value) 3.如何监测数组中的数据? 通过包裹数组更新元素的方法实现,本质就是做了两件事: (1)调用原生对应的方法对数组进行更新 (2)重新解析模板,进而更新页原创 2022-01-04 16:22:17 · 88 阅读 · 0 评论 -
Vue中常见按键的别名
1.Vue中常用的按键别名: 回车 => enter 删除 => delete (捕获"删除”和“退格”键) 退出 => esc 空格 => space 换行 => tab 上 => up 下 => down 左 => left 右 => right 2.Vue未提供别名的按键,可以使用按键原始的key值去绑定,但注意要转为kebab-case(短横线命名) 3.系统修饰键(用法特殊): ctrl、alt、 shift、met...原创 2021-12-29 10:18:16 · 1235 阅读 · 0 评论 -
Vue中的事件修饰符
Vue中的时间修饰符: 1.prevent:阻止默认事件 2.stop:阻止事件冒泡 3.once:事件只触发一次 4.capture:使用事件的捕获模式 5.self:只有event.target是当前操作的元素才会触发 6.passive:事件的默认行为立即执行,无需等待事件回调执行完毕 ...原创 2021-12-29 09:55:47 · 426 阅读 · 0 评论 -
Vue中的MVVM模型
MVVM模型: 1.M:模型(Model):data中的数据 2.V:视图(View):模板代码 3.VM:视图模型(ViewModel):Vue实例 (1)data中的所有属性,最后都出现在了Vue实例上 (2)vm身上的所有属性以及Vue原型上的所有属性,在Vue模板中都可以直接使用 ...原创 2021-12-28 10:15:06 · 324 阅读 · 0 评论 -
Vue中数据绑定的方式
Vue中有两种数据绑定方式: 1.单向数据绑定(v-bind):数据只能从data流回页面(单向传递) 2.双向数据绑定(v-model):数据不仅可以从data流向页面,还可以从页面流向data (1)双向数据绑定一般都应用在表单类元素上(如:input select checkbox等) (2)v-model:value 可以简写为 v-model 因为v-model默认收集的就是value值 ...原创 2021-12-28 09:43:57 · 736 阅读 · 0 评论