react-native引入其他值到render函数中

function Cat() {
    return (
        <View>
            <Text>I am a also cat!</Text>
        </View>
    );
}

function Cat2() {
    return (
        <View>
            <Text>I am a also cat!</Text>
        </View>
    );
}
function HelloTest (){
  return  (
      <View>
      <Text>Draft</Text>
  </View>);
}

或者在render return方法外包写入

   const hello = "Maru";

引入到render

 <Text >{hello}</Text>
                {/*<Text >{hello3}</Text>*/}

                <Cat />
                <Cat />
                <Cat />
                <Cat2 />
                <HelloTest />

目前通过引入箭头函数没有成功，不清楚为什么

const hello3 = () => (
        <View>
            <Text>Draft2</Text>
        </View>

完整的一个例子

import React from 'react';
import { Text, View } from 'react-native';
function Cat(props) {
  return (
    <View>
      <Text>Hello, I am {props.name}!</Text>
    </View>
  );
}
export default function Cafe() {
  return (
    <View>
      <Cat name="Maru" />
      <Cat name="Jellylorum" />
      <Cat name="Spot" />
    </View>
  );
}