React学习笔记——提升state(v15.5)

[TOC] 通常几个组件需要反映相同数据变化,我们推荐提升共享的state到它们最近的共同祖先元素。实现如下: 创建一个温度计算器来计算,给定温度的水是否会沸腾。 我们将从一个BoilingVerdict组件开始,它接收一个celsius作为prop参数,并且打印水温度。 123456function BoilingVerdict(props) &...

阅读全文

React学习笔记——组合与继承(v15.5)

[TOC] React有一个强大的组合模型,并且推荐组合代替继承,在组件间重用代码。 一些组件不能提前知道它们的子组件。它些问题在一些公共组件尤其明显。如:侧边栏或者弹出框等组件。 我们推荐这样的组件使用prop的特殊属性children,直接传递子元素到它们的输出中。 123456789101112131415161718192021functi...

阅读全文

React学习笔记——表单(v15.5)

[TOC] React中的HTML表单元素有点不同于其它DOM元素,因为表单元素天生具备一些内部状态。 1234567<form> <label> Name: <input type="text" name="name" /> </label> <input type="submi...

阅读全文

React学习笔记——条件渲染(v15.5)

[TOC] React条件渲染和JavaScript的条件工作方式是一样的。 使用JavaScript中if或者条件运算符来创建一个代表当前状态的元素,然后让React来更新匹配的UI。 12345678910111213141516171819202122232425//创建登陆用户后组件function UserGreeting(props...

阅读全文

React学习笔记——列表和Keys(v15.5)

[TOC] 渲染多个组件你可以创建一个元素集合,通过‘{}’在JSX中使用 1234567891011//创建元素集合const numbers = [1, 2, 3, 4, 5];const listItems = numbers.map((number) => <li>{number}</li>)...

阅读全文