TypeError:函数不是React本机中的函数

Question

完整错误为TypeError: doFollow is not a function. (In 'doFollow(index), 'doFollow is undefined)

我是React Native的新手，所以我不太确定问题可能是什么，代码如下：

render(){
      const followReq = this.props.navigation.getParam('followRequest', '0')
      const doFollow = this.props.navigation.getParam('doFollow', '')
    return (
      <View style={styles.container}>
        {
            followReq.map((frn, index) =>  (
                <Button 
                    key={frn}
                    title={`Follow ${frn}`}
                    onPress={() => doFollow(index)}
                />
            ))
        }
      </View> 
    );
  }

Answer 1

render(){
  const followReq = this.props.navigation.getParam('followRequest', '0')
  const doFollow = this.props.navigation.getParam('doFollow', '')
 return (
   <View style={styles.container}>
       { followReq.map((frn, index) =>  (
            <Button 
                key={frn}
                title={`Follow ${frn}`}
                onPress={() => {
                  this.doFollow(index);}}/>)) }
   </View>);}

Answer 2

如下所示访问您的导航参数。

render(){
      const followReq = this.props.navigation.state.params.followRequest;
      const doFollow = this.props.navigation.state.params.doFollow;
    return (
      <View style={styles.container}>
        {
            followReq.map((frn, index) =>  (
                <Button 
                    key={frn}
                    title={`Follow ${frn}`}
                    onPress={() => doFollow(index)}
                />
            ))
        }
      </View> 
    );
  }

或者将导航参数绑定到您的应用程序状态，如果您的应用程序使用react-redux，则如下所示进行访问

import { connect } from 'react-redux';

render(){
      const followReq = this.props.followRequest;
      const doFollow = this.props.doFollow;
    return (
      <View style={styles.container}>
        {
            followReq.map((frn, index) =>  (
                <Button 
                    key={frn}
                    title={`Follow ${frn}`}
                    onPress={() => doFollow(index)}
                />
            ))
        }
      </View> 
    );
  }


const mapStateToProps = (state, props) => {
  return {
    ...props.navigation.state.params
  };
};

export default connect(mapStateToProps)(ComponentName);