vue中子传父,父传子的具体用法
先说明下父组件Login,子组件signCon
子拿到父数据可以通过,在子组件里面设置props:['name']的方法拿到。
首先在父组件中定义数据了:
data(){
Englishname:'lishishi'
}
<signCon :name="Englishname"/>
子组件中:
props:['name']
在子组件中的html中就可以使用了{{name}}
子传父,想一想肯定是父组件想用子组件中的数据了
子组件中的html中有一个<button @click="go"><button/>
data(){
return{
sex:['男',‘女’]
}
}
methiods:{
go(){
this.$emit('thg',this.sex)
}
}
在父组件中也就是Login里面找到子组件也就是<signCon @thg="shows"/>
methods:{
shows(e){
this.data=e
}
}
vue中子传父,父传子的具体用法的更多相关文章
- Vue中子组件调用父组件的方法
Vue中子组件调用父组件的方法 相关Html: <!DOCTYPE html> <html lang="en"> <head> <meta ...
- vue中子组件调用父组件里面的数据和方法 父组件调用子组件的数据和方法
1.子组件直接调用父组件的数据和方法 在父组件father,vue <template> <div> <!-- 父组件里面的数据 --> <p>父组件里 ...
- vue中子组件向父组件传值
1.子组件$emit()触发,父组件$on()监听 子组件:<template> <div class="hello"> <button v-on:c ...
- Vue 编程之路(三)—— Vue 中子组件在父组件的 v-for 循环里,父组件如何调取子组件的事件
(标题的解决方案在第二部分) 最近公司的一个项目中使用 Vue 2.0 + element UI 实现一个后台管理系统的前端部分,属于商城类型. 一.前期思路: 其中在“所有订单”页面,UI 给的设计 ...
- vue.js(19)--vue中子组件调用父组件的方法
子组件是不能直接使用父组件中的方法的,需要进行事件绑定(v-on:自定义方法名="父组件方法名"),然后在子组件中再定义一个方法,使用this.$emit('自定义方法名')语句完 ...
- vue中子组件触发父组件的方法
网上找了几种方法,下面这两种最实用,最明了 方法一:父组件方法返回是字符串或数组时用这种方法 子组件: <template> <button @click="submit& ...
- vue中子组件更新父组件
当在子组件里更改了某些信息且关闭子组件后,需要父组件更新修改后的内容,该如何操作 1.$emit触发 父组件 @add="add(val)" 子组件 this.$emit('add ...
- Vue 子组件向父组件传参
直接上代码 <body> <div id="counter-event-example"> <p>{{ total }}</p> & ...
- vue 父组件给子组件传值 Vue父组件给子组件传方法 Vue父组件把整个实例传给子组件
Home.vue <template> <!-- 所有的内容要被根节点包含起来 --> <div id="home"> <v-header ...
随机推荐
- Go 语言学习笔记
1. go没有static关键字 面向对象编程中,尽量对函数进行封装,对于没有函数变量的对象,使用static关键字尤其方便. go中没有static关键字,必须每次new一个出来. type Han ...
- javaweb中使用百度、谷歌地图进行定位
第一种 百度 直接上代码: <!DOCTYPE> <html> <head> <meta name="viewport" content ...
- React组件间的通信
1.子组件调用父组件,采用props的方式进行调用和赋值,在父组件中设置相关属性值或者方法,子组件通过props的方式进行属性赋值或者方法调用: 2.父组件调用子组件,采用refs的方式进行调用,需要 ...
- [CSS] Useful CSS tool for Web designer and developer
1. Color Picker (Chrome) You might know how to use color picker in Chrome, recently there is a featu ...
- IDEA攻略合辑
AS使用lombok注解报错:Annotation processors must be explicitly declared now. The following dependencies on ...
- 类中添加log4j日志
在编写代码的时候需要随时查看工作日志,查看工作日志的好处就是随时能检查出错误.所以我一般就需要在编写代码的前期添加工作日志,以便更好的查看相关错误输出. 以一个springmvc小demo为例子 主 ...
- Python String Formatting Best Practices
https://imliyan.com/blogs/article/Python3.6%E6%96%B0%E7%9A%84%E5%AD%97%E7%AC%A6%E4%B8%B2%E6%A0%BC%E5 ...
- Ajax 请求头中常见content-type
四种常见的 POST 提交数据方式 HTTP 协议是以 ASCII 码传输,建立在 TCP/IP 协议之上的应用层规范.规范把 HTTP 请求分为三个部分:状态行.请求头.消息主体.协议规定 POST ...
- 我的2018:OCR、实习和秋招
真的是光阴似箭,好像昨天还沉浸在考研成功的喜悦,今天却要即将步入2019年,即将硕士毕业.老规矩,还是在每一年的最后一天总结今年以及展望明年.回首2018,经历的东西特别多,视野也开阔了不少,可以说, ...
- LoRa基础
一.LoRa技术 LoRa 是LPWAN通信技术中的一种,是美国Semtech公司采用和推广的一种基于扩频技术的超远距离无线传输方案.这一方案改变了以往关于传输距离与功耗的折衷考虑方式,为用户提供一种 ...