创建 Refs

  • Taro 支持使用字符串和函数两种方式创建 Ref:
  1. 使用字符串创建 ref
  2. 通过函数创建 ref(推荐)

    你也可以通过传递一个函数创建 ref, 在函数中被引用的组件会作为函数的第一个参数传递。如果是被引用的组件是自定义组件,那可以在任意的生命周期访问引用。

    不管在任何情况下,Taro 都推荐你使用函数的方式创建 ref。
class MyComponent extends Component {

  roar () {
// 会打印 `miao, miao, miao~`
this.cat.miao()
} refCat = (node) => this.cat = node // `this.cat` 会变成 `Cat` 组件实例的引用 render () {
return <Cat ref={this.refCat} />
}
} class Cat extends Components {
miao () {
console.log('miao, miao, miao~')
} render () {
return <View />
}
}

taro refs引用的更多相关文章

  1. React之this.refs, 实现数据双向绑定

    1.实现数据双向绑定 将input组件与this.state属性绑定,要么是readonly, 要么使用onChange事件: 获取input元素的value值,有两种方式: 1) e.target. ...

  2. 【转载】Perl异常处理方法总结

    程序脚本在运行过程中,总会碰到这样那样的问题,我们会预知一些问题并为其准备好处理代码,而有一些不能预知.好的程序要能尽可能多的处理可能出现的异常问题,本文就总结了一些方法来解决这些异常,当然perl在 ...

  3. react入门笔记

    this.props.children是任何内嵌的元素 利用ref属性给子组件命名,this.refs引用组件,getDOMNode()获取本地的DOM元素,如: this.refs.author.g ...

  4. JavaScript AMD 模块加载器原理与实现

    关于前端模块化,玉伯在其博文 前端模块化开发的价值 中有论述,有兴趣的同学可以去阅读一下. 1. 模块加载器 模块加载器目前比较流行的有 Requirejs 和 Seajs.前者遵循 AMD规范,后者 ...

  5. React实践

    React实践(一)   该实践取自官方教程:https://github.com/reactjs/react-tutorial 主要是自实现的过程以及一些心得体会 该实践是实现一个评论框. 一个展示 ...

  6. React实践(一)

    该实践取自官方教程:https://github.com/reactjs/react-tutorial 主要是自实现的过程以及一些心得体会 该实践是实现一个评论框. 一个展示所有评论的视图 一个提交评 ...

  7. 操作 实例 / dom

    响应式:数据改变时会触发其他联动.例如:模板中的数据绑定:计算属性的重新计算: ---------------------------------------------------- vm.$par ...

  8. vue的学习(常用功能)

    1.介绍vue MVP和MVVM模式!!! mvp模式,其中m是模型是ajax请求数据, v是视图层(html),p是控制器,就是使用jq来实现业务逻辑相关操作(DOM操作很多) MVVM模式,其中M ...

  9. 关于react-redux中Provider、connect的解析

    Provider 是什么 react-redux 提供的一个 React 组件 作用 把 store 提供给其子组件 //使用 redux 的 createStore 方法创建的一个 store co ...

随机推荐

  1. netty ------------ 如果selector检测到一个channel可以读了

    -----------------一个NioEventLoopGroup 的初始化的时候,会初始化一个 NioEventLoop数组,每个NioEventLoop在初始化的时候,会open一个sele ...

  2. python-函数参数不固定

    默认参数的应用场景: 1.默认安装 2.数据库连接,默认端口号   参数不固定的情况: 参数组: args:将接收的位置参数转换成元组 def test(*args):     print(args) ...

  3. php优秀框架codeigniter学习系列——index.php

    程序流程图 先来看看CI框架运行的程序流程图. 从图中我们 看到,index.php作为唯一的入口文件,会初始化CI框架运行所需的基本资源. 路由器(Routing)会根据http请求,确定如何处理: ...

  4. android 8.0 intent安装apk失败屏幕闪过

    需要做两处设置: 1.android8.0要加一条权限: <uses-permission android:name="android.permission.REQUEST_INSTA ...

  5. select语句的高级应用及实例

    本文介绍的select高级应用主要包括:联合查询.分组查询.嵌套查询和限定查询数目等,与实例对照演示,所使用数据库为sqlite3. 部门表(dept) CREATE TABLE dept( id I ...

  6. outlook vba开发要点

    1.学学基础的VB语法 https://www.yiibai.com/vba/vba_programming_charts.html 2.找一个样例看看 VBA编程实现自动回复邮件 https://b ...

  7. 用Java批量重命名文件

    要事先在C盘里创建“照片”和“照片1”两个文件夹 1import java.io.*; public class Jack { public static void main(String[] arg ...

  8. python的time模块

    #encoding=utf-8 import time # 返回时间戳 print time.time() # 延迟运行单位为s,如下为延迟3s time.sleep(3) # 转换时间戳为时间元组( ...

  9. python2.6.6 升级 2.7.X

    下载包 解压 cd 进入 ./configure && make all && make install && make clean && ...

  10. MySQL篇,第一章:数据库知识1

    MySQL 数据库 1 一.MySQL概述 1.什么是数据库       数据库是一个存储数据的仓库 2.哪些公司在用数据库       金融机构.购物网站.游戏网站.论坛网站... ... 3.提供 ...