react-native 语法笔记

react-native 基本框架---三板斧

1、引入基础组件

import React, {Component} from 'react';  //  引入 React 及 Component
import { StyleSheet, Text, View, PixelRatio} from 'react-native';  // 引入 基础 视图 组件，样式组件等官方组件
import { custom } from ' custom'  //  引入 自定义组件

2、功能实现 及 视图渲染

type Props = {};
export default class App extends Component<Props> {
  ··· 生命周期钩子
  ··· 数据处理
  ... 状态管理

  ... 视图渲染
  render() {
    return (
      <View style={styles.container}>
      ...
      </View>
    );
  }
}

... 样式表
const styles = StyleSheet.create({
  container: {
    marginTop: 200,
    flexDirection: 'row',
    ...
  }
})

3、页面挂载

import {AppRegistry} from 'react-native'; // 引入挂载方法
import App from './App'; // 引入需挂载页面，一般来说是首页
import {name as appName} from './app.json';  // 不知道是啥，稍后看了api再来更新

AppRegistry.registerComponent(appName, () => App); // 执行挂载