csx blog

1. Handling Events Html中处理添加事件： <a href="#" onclick="console.log('The link was clicked.'); return false"> Click me </a> React中： function ActionLink() { function handleClick(e) { ...

State and Lifecycle 何谓state A component needs state when some data associated with it changes over time. For example, a Checkbox component might need isChecked in its state, 组件内部涉及的数据会根据时间条件变化 随...

Components and Props Conceptually, components are like JavaScript functions. They accept arbitrary inputs (called “props”) and return React elements describing what should appear on the screen. Co...

Rendering Elements An element describes what you want to see on the screen. 原则：尽可能少的操作DOM 如下面react官网的例子就是很好的说明： function tick() { const element = ( <div> <h1>Hello, world!&lt...

Introducing JSX JSX语法实际上是在创建对象，产生的对象称为React elements; 对这些React elements进行渲染，构建出DOM const element = ( <h1 className="greeting"> Hello, world! </h1> ); // => 等于如下写法： const e...