React Nativeのprops書き方

React Nativeの公式ベースでみてみた
Learn the Basics · React Native

import React from 'react';
import { Text, View, StyleSheet } from 'react-native';

const styles = StyleSheet.create({
  center: {
    alignItems: 'center'
  }
})

const Greeting = (props) => {
  return (
    <View style={[styles.center, {top: 50}]}>
      <Text>Hello {props.name}!</Text>
    </View>
  );
}

const LotsOfGreetings = () => {
  return (
    <View style={[styles.center, {top: 50}]}>
      <Greeting name='Rexxar' />
      <Greeting name='Jaina' />
      <Greeting name='Valeera' />
    </View>
  );
}

export default LotsOfGreetings;

expoで動かすとこうなる

LotsOfGreetingsのGreetingに指定したnameがGreetingにプロパティで渡される
Greetingは受け取ったpropsの中のnameを取り出してHelloと結合して表示する流れのよう

わりとわかりやすいので良い

リンク