ReactNativeUI渲染分析

来源：互联网发布：ubuntu find file 编辑：程序博客网时间：2024/05/20 18:20

本文参考了http://www.cnblogs.com/zhang740/p/5978323.html

React的JSX语法http://www.css88.com/archives/tag/jsx%E8%AF%AD%E6%B3%95

//使用JSX
React.render(
    <div>
        <div>
            <div>content</div>
        </div>
    </div>,
    document.getElementById('example')
);
 
//不使用JSX
React.render(
    React.createElement('div', null,
        React.createElement('div', null,
            React.createElement('div', null, 'content')
        )
    ),
    document.getElementById('example')
);

RN HelloWorld的案例

render() {
    return (
      <Text>Hello world!</Text>
    );
}

我们看到我们使用JSX语法，后来还是通过React转换为纯JavaScript语法，我们可以想象通过JS和native的通信，最终会把传递到模块

@ReactModule(name = ReactTextViewManager.REACT_CLASS)public class ReactTextViewManager extends BaseViewManager<ReactTextView, ReactTextShadowNode> {

通过这个模块产生TextView和修改属性等.

九牛一毛的分析，未完待续...........................

0 0