(
問渠那得清如許羊瘩，為有源頭活水來泰佳。雙手奉上RN官網(wǎng))
props (創(chuàng)建組件時(shí)使用的參數(shù),是properties屬性復(fù)數(shù)的縮寫)
例如:
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就是一個(gè)prop參數(shù).在{}中可以嵌入JS表達(dá)
<Image source={pic} style={{width: 193, height: 110}}/>
);
}
}
AppRegistry.registerComponent('Bananas', () => Bananas);
- 你自己的組件也可以使用props,這使得你可以創(chuàng)建可重用的組件
例如:
import React, { Component } from 'react';
import { AppRegistry, Text, View } from 'react-native';
//自定義的問候組件
class Greeting extends Component {
render() {
return (
//使用 {this.props.name}來替換嵌入?yún)?shù)
<Text>Hello {this.props.name}!</Text>
);
}
}
class LotsOfGreetings extends Component {
render() {
return (
//style用于描述樣式
<View style={{alignItems: 'center'}}>
//這里通過name去設(shè)置不同的參數(shù)
<Greeting name='Rexxar' />
<Greeting name='Jaina' />
<Greeting name='Valeera' />
</View>
);
}
}
AppRegistry.registerComponent('LotsOfGreetings', () => LotsOfGreetings);
