子组件调用父组件的方法实例

出于某些目的,最近又开始研究起了rn,看着教程一步步的学习,在最近却是碰到了一个问题,那就是父子组件的方法调用的问题。这个问题我百度了很久,js的es6语法下,用class创建组件,子组件调用父组件方法模拟器不断报错。本文主要为大家分享一篇es6下子组件调用父组件的方法。希望能帮助到大家。

因为我看的视频是基于es5的语法来实现的代码,所以语法有些不同。

es5的语法下,方法的this都是RN已经帮我们处理好了的,所以按照视频中的示例是可以达成效果的,但是es6貌似是要自己写的。。

具体的写法就是在constructor中添加 this.xxxxx = this.xxxxx.bind(this);

或者在子组件绑定的时候就写this.xxxxx.bind(this) .

这里就不多讲了,下面上代码,以供需要的人参考。

export default class TestPrj extends Component {    constructor(props){      super(props);      this.timesReset = this.timesReset.bind(this);      this.state = {timex:2};    }    timesReset(){      this.setState({        timex:0      });    }    render() {      return(                            //或者              );    }  } class Son extends Component{    constructor(props){    super(props);    this.state = {times:this.props.timex};  }  componentWillReceiveProps(props){    console.log(this.props);    this.setState({      times:props.timex    })  }  timesReset(){    this.props.timesReset();  }  render(){    return(                儿子:虽然你揍了我 {this.state.times} 次,但是我 永 不 屈 服!!                    爹,再给你儿子一次机会!!              );  }}

登录后复制

相关推荐:

Vuejs2.0子组件调用父组件的方法

vue使用ref 让父组件调用子组件实例

Vue2.0关于父组件与子组件之间的事件发射与接收

以上就是子组件调用父组件的方法实例的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2786043.html

(0)
上一篇 2025年3月8日 17:39:05
下一篇 2025年3月7日 13:33:43

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • JS函数实例详解

    函数是由事件驱动的或者当它被调用时执行的可重复代码块,JavaScript函数语法,函数就是包裹在花括号中的代码块,前面使用了关键词function: function functionname(){     这里是要执行的代码 } 当调用…

    编程技术 2025年3月8日
    200
  • node.js中fs文件操作方法

    本文主要给大家详细分析了node.js中fs文件系统目录操作与文件信息操作的方法以及代码详解,需要的读者可以参考下。希望能帮助到大家。 目录操作 如果存在该目录,就创建失败 同步创建目录fs.mkdirSync(path, [mode]) …

    编程技术 2025年3月8日
    200
  • puppeteer破解滑动验证码方法

    本文主要和大家介绍了利用puppeteer破解极验的滑动验证功能,基本流程代码实现给大家介绍的非常详细,需要的朋友可以参考下,希望能帮助到大家、 基本的流程: 1. 打开前端网,点击登录。 2. 填写账号,密码。 3. 点解验证按钮,通过滑…

    2025年3月8日
    200
  • Vuejs搜索匹配功能实例详解

    本文主要和大家分享Vuejs搜索匹配功能实例,最近一直在看vue,查了很多资料,看了很多文档和博客,大概半知半解了,然后利用所理解的知识写了一个简单的搜索匹配功能。  大概长这个样子: nbsp;html>Vue测试2*{paddin…

    编程技术 2025年3月8日
    200
  • js中undefined实例解析

    在我们开发的时候,经常会遇到undefined的情况,本文主要和大家分享js中undefined问题的总结,希望能帮助到大家。  //1.变量声明了但是没赋值 解析器会给一个默认值 就是undefined    var a;    cons…

    编程技术 2025年3月8日
    200
  • js关于嵌套for循环实例

    javascript嵌套for循环内层如何break或continue外层的for循环呢?很简单,可以给外层for循环加上标签,break或continue的时候加上对应的标签名就可以了: outer: // 给外层的for循环加上标签,取…

    编程技术 2025年3月8日
    200
  • JS中常用封装方法分享

    1.前言 大家在开发的时候应该知道,有很多常见的实例操作。比如数组去重,关键词高亮,打乱数组等。这些操作,代码一般不会很多,实现的逻辑也不会很难,下面的代码,我解释就不解释太多了,打上注释,相信大家就会懂了。但是,用的地方会比较,如果项目有…

    2025年3月8日
    200
  • ngrok+express解决微信接口调试方法

    在微信项目的开发的时候,经常需要对微信jssdk提供的接口进行调试,比如说录音, 分享 ,上传图像等接口,但是微信jssdk要求绑定安全域名才能使用其提供的一系列功能 , 而在开发环境中使用localhost或者本地ip无法完成域名的认证和…

    2025年3月8日 编程技术
    200
  • D3.js 实现动态进度条实例

    d3 的全称是(data-driven documents),顾名思义可以知道是一个被数据驱动的文档。听名字有点抽象,说简单一点,其实就是一个 javascript 的函数库,使用它主要是用来做数据可视化的。如果你不知道什么是 javasc…

    2025年3月8日 编程技术
    200
  • vue-cli编写vue插件实例

    本文主要介绍了使用vue-cli编写vue插件的方法,利用vue组件创建模板,使用webpack打包生成插件再全局使用。 1、vue init webpack-simple 生成项目目录 2、调整目录结构 3、修改webpack.confi…

    2025年3月8日
    200

发表回复

登录后才能评论