React
年轻的老六
积少成多
展开
-
React 父组件调用子组件方法
react中我们都知道组件间的通信几乎都是通过props或者回调函数形式进行传递(子组件调用获取父组件),但是实际开发中会因为组件划分或者业务需求,不得不在父组件中调用子组件的方法(操作父组件来调用子组件的方法,来改变子组件的state)。import reacr {Component} from 'react';class Parent extends Component { ...原创 2018-11-13 11:32:53 · 1056 阅读 · 0 评论 -
React状态
1. React state 状态React 把组件看成是一个状态机(State Machines)。通过与用户的交互,实现不同状态,然后渲染 UI,让用户界面和数据保持一致。React 里,只需更新组件的 state,然后根据新的 state 重新渲染用户界面(不要操作 DOM)。以下实例中创建了 LikeButton 组件,getInitialState 方法用于定义初始状态,也就是一个...原创 2018-11-29 10:33:14 · 406 阅读 · 0 评论 -
React JSX简介
React 使用 JSX 来替代常规的 JavaScript。JSX 是一个看起来很像 XML 的 JavaScript 语法扩展。我们不需要一定使用 JSX,但它有以下优点:JSX 执行更快,因为它在编译为 JavaScript 代码后进行了优化。它是类型安全的,在编译过程中就能发现错误。使用 JSX 编写模板更加简单快速。ReactDOM.render( <h1&...原创 2018-11-29 10:35:56 · 181 阅读 · 0 评论 -
【react】利用shouldComponentUpdate钩子函数优化react性能
凡是参阅过react官方英文文档的童鞋大体上都能知道对于一个组件来说,其state的改变(调用this.setState()方法)以及从父组件接受的props发生变化时,会导致组件重渲染,正所谓"学而不思则罔",在不断的学习中,我开始思考这一些问题:1.setState()函数在任何情况下都会导致组件重渲染吗?如果setState()中参数还是原来没有发生任何变化的state呢?2....转载 2018-11-29 14:34:23 · 687 阅读 · 0 评论 -
基于hilo和react的农场小游戏
http://note.youdao.com/noteshare?id=aea0154d0eb1ae9d7c80b8dfd9552f57&sub=6D423198117E4AFAB57C1542A556F264原创 2019-06-08 21:09:37 · 814 阅读 · 0 评论 -
React中Hook的使用
1.什么是Hook?Hook是React 16.8的新增属性。可以在不编写calss的情况下使用state以及其他的React特性2.Hook优势?其主要是为了解决一下几个常见问题:在组件之间服用状态逻辑难复杂组件变的难以理解class学习及js中this的工作方式简化周期函数,避免重复代码…Hook可以让我们无需学习浮躁的函数式和响应式编程,同时也遵循React的精神原则。...原创 2019-06-17 22:01:11 · 1651 阅读 · 0 评论 -
react列表组件渲染中key的作用
我们在开发react列表组件时,如果遍历项中缺少key,那么就会出现一个警告,a key should be provided for list items,就是当创建一个元素时,必须包含一个特殊的key属性。那么为什么要加这个key,其作用又是什么呢?首先来看一下官方的解释:key帮助React识别了哪些元素改变了,如添加或删除,所以需要给列表元素赋予一个唯一的标识const number...原创 2019-07-01 17:54:30 · 1116 阅读 · 0 评论