React Native 03 (React JSX基础)

React Native

React JSX基础

ReactJS核心思想：组件化，维护自己的状态和UI， 自动重新渲染，多个组件组成了一个ReactJS应用。

React是全局对象， 顶层API与组件API。

React是由ReactJS与React Native组成，其中ReactJS是Facebook开源的一个前端框架，React Native是ReactJS思想在native上的体现。

JSX并不是一门新的语言，仅仅是个语法糖，允许开发者在JavaScript中书写HTML语法，最后每个HTML标签都转化为JavaScript代码来来进行。

ReactJS和React Native的区别

ReactJSAndReactNative.png

ReactJS和React Native的原理区别

ReactJS和React Native的原理区别.png

根节点必须单一子节点

根节点必须单一子节点.png

"空值"自动忽略

"空值"自动忽略.png

组件必须大写字母开头

组件必须大写字母开头.png

文本必须写在Text组件内

文本必须写在Text组件内.png

注释的写法比较特殊

注释的写法比较特殊.png

只能嵌入表达式

只能嵌入表达式.png

JSX !== HTML

JSX !== HTML.png

借鉴XHTML的一些规则/规范

借鉴XHTML的一些规则/规范.png

万物生长靠太阳，界面变化靠state

• 一切界面变化都是状态state变化
• state的修改必须通过setState()方法
  • this.state.likes = 100；这样的直接赋值修改无效!
  • setState是一个merge合并操作，只修改指定属性，不影响其他属性
  • setState是异步操作，修改不会马上生效