在看《react小书》高阶组件一节的时候,看到如下代码

import React, { Component } from 'react'

export default (WrappedComponent, name) => {
class NewComponent extends Component {
constructor () {
super()
this.state = { data: null }
} componentWillMount () {
let data = localStorage.getItem(name)
this.setState({ data })
} render () {
return <WrappedComponent data={this.state.data} />
}
}
return NewComponent
}

  忽然大脑短路了:return <WrappedComponent data={this.state.data} /> 中为何不用this.props来使用data,而使用this.state呢。

  想了一会儿,忽然觉醒,你这是把对子组件的定义和使用搞混了。子组件在定义的时候用this.props来接受未来父组件传来的参数,父组件调用子组件的时候,是直接把父组件的值传过来的,所以用this.state。可以类比函数定义与调用。

一个自己犯的react错误的更多相关文章

  1. 关于TextView的setText()与Integer之间一个易犯的小错误

    [转载]原文:https://my.oschina.net/xybob/blog/59524 先上图: TextView的setText()函数的两个重载函数 因为TextView有两个不同的重载函数 ...

  2. Python 字典一个易犯的错误

    一个易犯的错误,关于 Python 的传值(对于不可变量) 和 传引用(对于可变量),浅拷贝和深拷贝.废话不多说,看例子, 直接改变可变字典值,失败, >>> dic = dict. ...

  3. 【转载学习前辈的经验】-- Mistakes I made (as a developer) 我(作为一名开发者)所犯过的错误

    我 2006 年开始工作,至今已经 10 年.10 年是个里程碑,我开始回顾自己曾经犯过的错误,以及我希望从同行那里得到什么类型的忠告.一切都在快速改变,10 年了,我不能确定这些秘诀是否还有用. 不 ...

  4. SQLSERVER DBA容易犯的十个错误

    SQLSERVER DBA容易犯的十个错误 翻译自:http://sqlsentry.tv/top-10-administrative-mistakes-on-sql-server/ 除了排名前十的错 ...

  5. PHP开发者常犯的MySQL错误

    PHP开发者常犯的MySQL错误   数据库是WEB大多数应用开发的基础.如果你是用PHP,那么大多数据库用的是MYSQL也是LAMP架构的重要部分. PHP看起来很简单,一个初学者也可以几个小时内就 ...

  6. 关于JDBC学习过程中的注意事项(分享自己犯过的错误,写给初学JDBC的小伙伴的八条建议)

    关于JDBC学习过程中的注意事项(分享自己犯过的错误,写给初学JDBC的小伙伴的八条建议) 前言:最近在学习JDBC,总结了几个小问题,特地分享给大家,让大家不要犯这样的错误,也希望大家养成学会总结的 ...

  7. Socket编程, 在server端read()函数调用后显示错误:Transport endpoint is not connected (犯了低级错误)

    for(;;){ socklen_t len = sizeof(client_address); connfd = accept(listenfd, (struct sockaddr *)&c ...

  8. Verilog与SystemVerilog编程陷阱:怎样避免101个常犯的编码错误

    这篇是计算机类的优质预售推荐>>>><Verilog与SystemVerilog编程陷阱:怎样避免101个常犯的编码错误> 编辑推荐 纠错式学习,从"陷阱 ...

  9. 记一个vue-resource请求的低级错误

    对于初学的小菜鸡,经常会犯一些低级错误. 现在记录一下我在使用vue-resource发送post请求时的一个低级错误: window.BaseURL = '127.0.0.1:8888'; 8888 ...

随机推荐

  1. Could not find action or result: There is no Action mapped for namespace [/] and action name [GetG

    Could not find action or result: /car/GetGpsDataAction  There is no Action mapped for namespace [/] ...

  2. Codeforces 232A - Cycles (构造 + 思维)

    题目链接: 232A - Cycles(点击打开) 题意: 要构成一个存在 \(k\) 个三元环的图,需要多少个点,输出顶点数 \(n\),并输出图. 题解: 题目中的任何图都可以用 \(90\)~ ...

  3. PythonOOP面向对象编程2

    编程语言的特征: 继承 封装 多态 如:C++ / Java / Python / Swift / C# inheritance 继承 drived 派生 概念: 继承是指从已有的类中衍生出新类,新类 ...

  4. GO语言学习(十一)Go 语言循环语句

    Go 语言提供了以下几种类型循环处理语句: 循环类型 描述 for 循环 重复执行语句块 循环嵌套 在 for 循环中嵌套一个或多个 for 循环 语法 Go语言的For循环有3中形式,只有其中的一种 ...

  5. [Vue] Load components when needed with Vue async components

    In large applications, dividing the application into smaller chunks is often times necessary. In thi ...

  6. Log4net.confager配置

    <?xml version="1.0" encoding="utf-8"?><log4net>  <level value=&qu ...

  7. ios 不支持屏幕旋转

    - (NSUInteger)supportedInterfaceOrientations { return UIInterfaceOrientationMaskPortrait; }

  8. swift项目第十天:网络请求工具类的封装

    import UIKit /* 必须先导入头文件:import AFNetworking */ import AFNetworking //MARK:-0:定义枚举:以枚举定义请求网络的get和pos ...

  9. OAM配置代理手冊

     创建webgate与ohs共享实例,copy文件到ohs实例文件夹. 1)进入webgage部署工具文件夹       Cd  /%webgate_home%/webgate/ohs/tools ...

  10. ES权威指南1

    Elasticsearch学习笔记 一 本文版权归博客园和作者吴双本人共同所有 转载和爬虫请注明原文地址 www.cnblogs.com/tdws. 本文参考和学习资料 <ES权威指南> ...