taro中子父传值
其实网上很多方法,我这只是一个简单的demo,废话不多说直接上代码
import Taro, { Component } from '@tarojs/taro'
import { View, Text } from '@tarojs/components'
import './index.less'
//子组件
class Child extends Component{
constructor(props) {
super(props);
this.state = ({
})
}
handleVal (event) {
this.props.handleEmail(event.target.value);
}
render (){
return (
<div>
请输入邮箱:<input style="width:200px;height:30px;font-size:18px;" ref="emailDom" onChange={this.handleVal.bind(this)} />
</div>
)
}
};
export default class Index extends Component {
constructor(props) {
super(props);
this.state = {
email:"火星黑洞"
}
}
handleEmail1(date){
this.setState({
email:date
})
}
config = {
navigationBarTitleText: '首页'
}
componentWillMount () { }
componentDidMount () { }
componentWillUnmount () { }
componentDidShow () { }
componentDidHide () { }
render () {
return (
<div className='index'>
<h3>子父传值</h3>
<Child name="email" handleEmail={this.handleEmail1.bind(this)}/>
<div>用户邮箱:{this.state.email}</div>
</div>
)
}
}
然后执行:cnpm run dev:h5
页面效果是:

taro中子父传值的更多相关文章
- vue 实现子向父传值
父组件 <template> <div id="app"> <child @onChange='onChildValue'></child ...
- react hooks子给父传值
子给父传值需要通过事件方法来传值,这里我们子组件是触发了一个点击事件传值: <Button onClick={()=>setshowregister(false)}>注册</B ...
- uniapp和vue 父向子传值、传方法及子向父传值。(一看就会超级简约)
1.父向子传值:父组件在引用子组件时通过自定义属性绑定自身需要传递的值(数据),子组件用props:[ '自定义' ]接收即可使用(props里数据是只读模式).(简约版:子绑定父的属性并用pro ...
- vue中子组件传值给父组件
index.js 子组件 父组件
- vue子向父传值
要弄懂子组件如何向父组件传值,需要理清步骤 子组件向父组件传值的步骤 一:子组件在组件标签上通过绑定事件的方式向父组件发射数据 <!--html--><template id=&qu ...
- 每天一点点之 taro 框架开发 - taro调用组件传值
1.调用组件 组件文件 import Taro, { Component } from '@tarojs/taro' import { View } from '@tarojs/components' ...
- js中子父页面数据传递与方法调用
A父页面 ,B为子页面 1.父页面调用子页面 A中调用B中方法:self.frames[iframeName].BFunction(); 注:iframeName:为父页面中iframe的name属性 ...
- iframe中子父窗口互调的js方法
转载自:http://www.cnblogs.com/chinafine/archive/2011/09/15/2177746.html 一.父窗口调用iframe子窗口方法 1.HTML语法:< ...
- iframe中子父页面跨域通讯
目录 #跨域发送信息 #跨域接收信息 #示例Demo 在非跨域的情况下,iframe中的子父页面可以很方便的通讯,但是在跨域的情况下,只能通过window.postMessage()方法来向其他页面发 ...
随机推荐
- 【Unity】项目工程源码
Unity开发者俱乐部 http://blog.csdn.net/dingxiaowei2013/article/details/50605208 游戏蛮牛 9秒社团 6m5m raywenderli ...
- KL divergence
Kullback-Leibler divergence 形式: 性质: 非负 P=Q时,D[P||Q]=0 不对称性:D(P||Q)≠D(Q||P) 自信息:符合分布 P 的某一事件 x 出现,传达这 ...
- 深度讲解 .net session 过期机制
[参考]net session过期 原理及解决办法 [参考]深入理解session过期机制
- 【Zookeeper系列】构建ZooKeeper应用(转)
原文地址:https://www.cnblogs.com/sunddenly/p/4064992.html 一.配置服务 配置服务是分布式应用所需要的基本服务之一,它使集群中的机器可以共享配置信息中那 ...
- 以太坊: ETH 发送交易 sendRawTransaction 方法数据的签名 和 验证过程
作者:林冠宏 / 指尖下的幽灵 掘金:https://juejin.im/user/587f0dfe128fe100570ce2d8 博客:http://www.cnblogs.com/linguan ...
- C++对windows控制面板的操作
经常碰到程序无法卸载, 就老是骂微软搞的什么安装方式,安装好了不能卸载. 后来就打算研究一下windows是如何卸载程序的,一个程序安装完后留下了什么信息用于后面的卸载. 研究对象win7 64位, ...
- java代码理解
public int maxProfit(int k, int[] prices) { int pl = prices.length; int nothin ...
- MultipartFile实现文件上传
一.主要有两个java类,和一般的servlet放在一起即可. 1.FileUploadBean.java package chb.demo.web;import org.springframewor ...
- vue里在自定义的组件上定义的事件
事件分为原生事件和自定义事件. vue里在自定义的组件上定义的事件,都被认为是自定义事件,必须用$emit()来触发. 这也是子组件向父传值的原理. 如果想作为原生事件,需要在原生事件后面加上.nat ...
- vue里computed的get和set
computed里的对象有get和set方法. get是当该对象所依赖的变量发生变化是执行,重新returncomputed结果. set是该对象的值变化时会执行,并且将变化的结果作为参数传进set里 ...