什么是myFunction不是函数？

Question

我正在将storyLike函数从父级传递给子级。有时，单击onPress时出现以下错误：this.props.storyLike（props.story）不是函数。 我认为这是一个上下文问题，但无法解决。

这是我的父母：

renderRow(item) {
        return (
          <Story
            story={item}
            openStory={this.props.openStory}
            getProfile={this.props.getProfile}
            storyLike={this.props.storyLike}
          />
        );
      }

这是子组件Story，只是将道具传递给StoryFooter组件：

class Story extends Component {
  render() {
    return (
      <View style={styles.container}>
        <StoryHeader {...this.props} />
        <StoryContent {...this.props} />
        <StoryFooter {...this.props} storyViewType={"feed"} />
      </View>
    );
  }
}

波纹管是子组件，我从onPress changeLikedStatus函数触发了storyLike：

class StoryFooter extends Component {
  state = { isLiked: false, likes: 0 };

  changeLikedState(props) {
    const numberOflikes = this.state.isLiked
      ? this.state.likes - 1
      : this.state.likes + 1;

    if (this.state.isLiked) {
      this.setState({ isLiked: false, likes: numberOflikes });
    } else {
      this.setState({ isLiked: true, likes: numberOflikes });
    }
      this.props.storyLike(props.story);
  }

            <TouchableOpacity onPress={() => this.changeLikedState(this.props)}>

Answer 1

这就是你父母的样子

  renderRow(item) {
            return (
              <Story
                // ... other props
                storyLike={(prop) => this.props.storyLike(prop)}
              />
            );
          }

这样，您可以明确地告诉孩子将向该函数传递一个prop。

希望您的storyLike函数是一个箭头函数，如下所示：

storyLike = (prop) => {
    // code
}