其实网上很多方法,我这只是一个简单的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中子父传值的更多相关文章

  1. vue 实现子向父传值

    父组件 <template> <div id="app"> <child @onChange='onChildValue'></child ...

  2. react hooks子给父传值

    子给父传值需要通过事件方法来传值,这里我们子组件是触发了一个点击事件传值: <Button onClick={()=>setshowregister(false)}>注册</B ...

  3. uniapp和vue 父向子传值、传方法及子向父传值。(一看就会超级简约)

    1.父向子传值:父组件在引用子组件时通过自定义属性绑定自身需要传递的值(数据),子组件用props:[  '自定义'  ]接收即可使用(props里数据是只读模式).(简约版:子绑定父的属性并用pro ...

  4. vue中子组件传值给父组件

    index.js 子组件 父组件

  5. vue子向父传值

    要弄懂子组件如何向父组件传值,需要理清步骤 子组件向父组件传值的步骤 一:子组件在组件标签上通过绑定事件的方式向父组件发射数据 <!--html--><template id=&qu ...

  6. 每天一点点之 taro 框架开发 - taro调用组件传值

    1.调用组件 组件文件 import Taro, { Component } from '@tarojs/taro' import { View } from '@tarojs/components' ...

  7. js中子父页面数据传递与方法调用

    A父页面 ,B为子页面 1.父页面调用子页面 A中调用B中方法:self.frames[iframeName].BFunction(); 注:iframeName:为父页面中iframe的name属性 ...

  8. iframe中子父窗口互调的js方法

    转载自:http://www.cnblogs.com/chinafine/archive/2011/09/15/2177746.html 一.父窗口调用iframe子窗口方法 1.HTML语法:< ...

  9. iframe中子父页面跨域通讯

    目录 #跨域发送信息 #跨域接收信息 #示例Demo 在非跨域的情况下,iframe中的子父页面可以很方便的通讯,但是在跨域的情况下,只能通过window.postMessage()方法来向其他页面发 ...

随机推荐

  1. 【资料下载区】【GK101固件】更新日期2017/1/11

    <GK101任意波发生器>升级固件发布(版本:1.0.2build539)<GK101任意波发生器>升级固件发布(版本:1.0.2build851)<GK101任意波发生 ...

  2. 网页调启用qq对话聊天客服窗口的链接地址方法大全(包含移动端)

    z转自:    http://www.wazhuti.com/1781.html 在PC端,腾讯的QQ软件还是应用最为广泛的即时通讯工具了,除了网站自动的一些对话软件外,qq可以有效的将用户留存下来, ...

  3. PCL点云配准(3)

    (1)关于点云的配准 1.首先给定源点云与目标点云. 2.提取特征确定对应点 3.估计匹配点对应的变换矩阵 4.应用变换矩阵到源点云到目标点云的变换 配准的流程图 通过特征点的匹配步骤 (1)计算源点 ...

  4. halcon 动态阈值分割之偏移值

  5. centos7下使用docker安装nginx

    需要环境docker,此处不做介绍. 1. docker拉取官方nginx镜像 docker pull nginx 2. 等待下载完成后,我们就可以在本地镜像列表里查到 REPOSITORY 为 ng ...

  6. spark StructType的应用,用在处理mongoDB keyvalue

    近期在处理mongoDB 数据的时候,遇到了非常奇怪的格式,账号密码的日志都追加在一条记录里面,要取一个密码的时长和所有密码的平均时长就非常繁琐. 用了各种迭代计算,非常困难,而且printschem ...

  7. there was an error running the selected code generator unable to retrieve metadata for

    there was an error running the selected code generator unable to retrieve metadata for PROBLEM: I ha ...

  8. init_ir_技术实现篇

    1. 中断的初始化 中断向量号是8位的,那么它一共有256项(0-255),所以中断描述符表最多只有256项,中断向量表也是256项. 对于不同的中断,在中断初始化和中断处理过程中,其处理方式是不一样 ...

  9. mac 互传文件

    搭建HTTP服务,然后局域网访问就行 PHP方式: php -S 172.21.205.xxx:9999 Python python -m SimpleHTTPServer 8001 在浏览器访问:h ...

  10. PHP 通过构造器进行依赖注入 demo

    class A{ public $b; public $f; function __construct( B $b , $f = 1 ){ $this->b = $b; $this->f ...