vue中$emit 和$on 和$set的用法
1.$set的用法:给 student对象新增 age 属性
data () {
return {
student: { name:"里斯'}
}
}
直接给student赋值不会触发视图更新
mounted () { this.student.age = 18}
正确写法:this.$set(this.data,”key”,value’)
mounted () { this.$set(this.student,"age", 18) }
2.this.$emit()触发事件 vm.$emit(event,"参数")
监听当前实例上的自定义事件。事件可以由vm.$emit触发。回调函数会接收所有传入事件触发函数的额外参数
3.vm.$on(event,callback)
触发当前实例上的事件。附加参数都会传给监听器回调。
vue中$emit 和$on 和$set的用法的更多相关文章
- vue的$emit 与$on父子组件与兄弟组件的之间通信
本文主要对vue 用$emit 与 $on 来进行组件之间的数据传输. 主要的传输方式有三种: 1.父组件到子组件通信 2.子组件到父组件的通信 3.兄弟组件之间的通信 一.父组件传值给子组件 父组件 ...
- TypeScript基础以及在Vue中的应用
TypeScript推出已经很长时间了,在Angular项目中开发比较普遍,随着Vue 3.0的即将推出,TypeScript在Vue项目中使用也即将成为很大的趋势,笔者也是最近才开始研究如何在Vue ...
- 第四节:Vue表单标签和组件的基本用法,父子组件间的通信
vue表单标签和组件的基本用法,父子组件间的通信,直接看例子吧. <!DOCTYPE html> <html> <head> <meta charset=&q ...
- vue条件语句v-if、v-else、v-else-if用法
vue条件语句v-if.v-else.v-else-if用法 v-if 是“真正”的条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建.v-if 也是惰性的:如果在初始渲 ...
- 基于iscroll的better-scroll在vue中的使用
什么是 better-scroll better-scroll 是一个移动端滚动的解决方案,它是基于 iscroll 的重写,它和 iscroll 的主要区别在这里.better-scroll 也很强 ...
- better-scroll在vue中的应用
在我们日常的移动端项目开发中,处理滚动列表是再常见不过的需求了,以滴滴为例,可以是这样竖向滚动的列表,如图所示: 微信 —> 钱包—>滴滴出行”体验效果. 什么是 better-scrol ...
- antV G6流程图在Vue中的使用
最近我司项目中需要加入流程图制作功能,于是乎百度各种找可视化绘制拓扑图的轮子,大部分都是国外的,看文档太吃力,不过好在最终让我发现了AntV G6流程图图表库,最新版为2.0,不过编辑器在2.0版本还 ...
- sync 修饰符在Vue中如何使用
在有些情况下,我们可能需要对一个 prop 进行"双向绑定".不幸的是,真正的双向绑定会带来维护上的问题,因为子组件可以修改父组件,且在父组件和子组件都没有明显的改动来源. 这 ...
- 怎么在vue中使用less
最近使用vue2.0重构项目, 使用vue-cli脚手架构建, 采用webpack模板, 要在项目中使用less进行样式的编写 首先, 打开终端, 在当前项目目录下安装less npm install ...
随机推荐
- 4. Oracle数据库用户管理备份与恢复
一. Oracle用户管理备份介绍 Oracle物理备份核心就是将物理文件拷贝一份副本:存放在磁盘上.物理文件指的是:数据文件,控制文件,日志文件,参数文件等等. 根据数据库状态而分:备份可分为热备份 ...
- Win10系统Ping端口及利用telnet命令Ping 端口
启用 telnet 客户端组件为 Ping 端口做准备 在程序界面下,选择“打开或关闭Windows功能”,如下图所示: 在打开的对话框中,找到“Telnet客户端”并勾选.最后点击“确定”,等待几分 ...
- URL中的空格
如果URL中带空格,在浏览器中可以显示,但是如果访问比如 UIImage 获取图片的时候就会出现BAD URL. 解决: NSString* urlText = @"70.84.58.40/ ...
- 微信小游戏的本地缓存和清除的使用 (text.js image.js file-util.js)
参考: 微信小游戏,文件系统 UpdateManager-小游戏 一.Egret提供的本地缓存工具类( 备注:新版本进行了修改,并增加了sound.js等) 在微信小游戏项目中,Egret提供了fil ...
- 微信小程序:bindtap等事件传参
事件是视图层到逻辑层的通讯方式. 事件可以将用户的行为反馈到逻辑层进行处理. 事件可以绑定在组件上,当达到触发事件,就会执行逻辑层中对应的事件处理函数. 事件对象可以携带额外信息,如 id, data ...
- 【吴恩达课后测验】Course 1 - 神经网络和深度学习 - 第一周测验【中英】
[吴恩达课后测验]Course 1 - 神经网络和深度学习 - 第一周测验[中英] 第一周测验 - 深度学习简介 和“AI是新电力”相类似的说法是什么? [ ]AI为我们的家庭和办公室的个人设备供电 ...
- HDU - 6231 K-th Number (2017CCPC哈尔滨站 二分+尺取法)
Alice are given an array A[1..N] with N numbers. Now Alice want to build an array B by a parameter K ...
- web.config 加密/解密 正确版
一般加密方式: 利用Aspnet_regiis: cd C:\Windows\Microsoft.NET\Framework\v4.0.30319 aspnet_regiis -pe "co ...
- dma传输数据长度,在启动前必须确保是一个大于0的数字
否则将导致不能接受数据
- POJ 1456 - Supermarket - [贪心+小顶堆]
题目链接:http://poj.org/problem?id=1456 Time Limit: 2000MS Memory Limit: 65536K Description A supermarke ...