码农的博客

例如，我们要定义一个组件CarView。数据用一个类Car来表示，Car有以下的属性：id, name, color。

class Car {

constructor(id, name, color) {

this.id = id;

this.name = name;

this.color = color;

}

}

我们在CarView的上级组件的state里有一个Car类型的对象car，想把car的属性的值传给CarView组件去渲染界面，这时候可以采用如下的传递参数的方法：

<CarView {…this.state.car} />

在CarView定义里可以使用this.props.id, this.props.name, this.props.color来获得传递进来的参数。如：

在CarView的render方法里：

<Text>{this.props.name}</Text>，可以渲染出car的name。

以上的写法相当于<CarView id={this.state.car.id} name={this.state.car.name}  color={this.state.car.color} />。

可见这种写法使代码得以简化。

import React, { Component } from “react”;

import语句里有时候加大括号，有时候不加。区别如下：

1. 如果是default export，则import的时候不加大括号。

2. 如果是named export，则import的时候必须加大括号。

例如：导出时是export default App，则导入时就是import App from ‘/path/App’;

导出时没有使用default关键字，如export const A=25  或者 export {MyComponent}， 则导入时就是import {A} from ‘/path/App’，这时就要加大括号。

一个组件只能有一个default export，和任意个named export。

1. （1）在android\app\src\main下建立一个assets文件夹

react-native init AwesomeProject
cd AwesomeProject
react-native run-android
npm uninstall react-native
npm install --save react-native@0.55.4
react-native run-android
npm install --save babel-core@latest babel-loader@latest
npm uninstall --save babel-preset-react-native
npm install --save babel-preset-react-native@4.0.0
react-native run-android