类组件React Native中的功能组件

时间:2020-05-03 10:52:35

标签: reactjs react-native react-native-navigation

嗨,我有以下功能组件,它们本身可以完美运行

function MeditationList({route, navigation}) {
  const adress = route.params;

  return (
    <View>
      <HeaderBar />
      <Text>
        You have a number of {JSON.stringify(adress.item.numMed)} meditations
      </Text>
    </View>
  );
}

但是当我尝试将其包含在类组件中时,它不起作用,给我以下错误

class PreScreen extends Component {
  meditationList = ({route}) => {
    const adress = route.params;

    return (
      <Text>
        You have a number of {JSON.stringify(adress.item.numMed)} meditations
      </Text>
    );
  };
  render() {
    return (
      <ScrollView>
          {this.meditationList()}
      </ScrollView>
    );
  }

我想我犯了一些愚蠢的错误。谢谢。

1 个答案:

答案 0 :(得分:1)

道具不会自动注入您的方法。如果要使用路由,则应使用this.props.route

class PreScreen extends Component {
  meditationList = () => {
    const adress = this.props.route.params;

    return (
      <Text>
        You have a number of {JSON.stringify(adress.item.numMed)} meditations
      </Text>
    );
  };
  render() {
    return (
      <ScrollView>
          {this.meditationList()}
      </ScrollView>
    );
  }