(
问渠那得清如许，为有源头活水来。双手奉上RN官网)
props (创建组件时使用的参数,是properties属性复数的缩写)
例如:
import React, { Component } from 'react';
import { AppRegistry, Image } from 'react-native';
class Bananas extends Component {
render() {
let pic = {
uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg'
};
return (
//这里的source就是一个prop参数.在{}中可以嵌入JS表达
<Image source={pic} style={{width: 193, height: 110}}/>
);
}
}
AppRegistry.registerComponent('Bananas', () => Bananas);
- 你自己的组件也可以使用props,这使得你可以创建可重用的组件
例如:
import React, { Component } from 'react';
import { AppRegistry, Text, View } from 'react-native';
//自定义的问候组件
class Greeting extends Component {
render() {
return (
//使用 {this.props.name}来替换嵌入参数
<Text>Hello {this.props.name}!</Text>
);
}
}
class LotsOfGreetings extends Component {
render() {
return (
//style用于描述样式
<View style={{alignItems: 'center'}}>
//这里通过name去设置不同的参数
<Greeting name='Rexxar' />
<Greeting name='Jaina' />
<Greeting name='Valeera' />
</View>
);
}
}
AppRegistry.registerComponent('LotsOfGreetings', () => LotsOfGreetings);
