javascript - typescript :类型错误未定义

Question

我对 Typescript 和 React 还很陌生。我一直在尝试实现 react-rewards npm 库，除了一个问题，我已经解决了所有问题。

type Props = {}

class Surprisebutton extends Component<Props>{
    reward: any;

    render() {
        return (
            <Reward 
            ref={(ref) => { this.reward = ref }}
            type='memphis'>
                <Button onClick={this.reward.rewardMe()} style={styles.button} variant="contained" color="primary">
                    Surprise!
              <FavoriteIcon style={{ marginLeft: 10 }} />
                </Button>
            </Reward>
        )
    }
}

运行 npm start 后，我收到一条错误消息，显示 TypeError: this.reward is undefined。最好的解决方法是什么？

Answer 1

它与 TypeScript 无关。 TS 只是一个编译器和 linter，你会遇到运行时错误。就是这一行:

this.reward.rewardMe()

ref 在组件完全安装后分配并且 rewardMe() 试图立即调用它。这也是次要错误。您不想使用 () 调用，否则该函数将立即触发(并且永不停止)。

这条线应该是

<Button onClick={this.reward.rewardMe} style={styles.button} variant="contained" color="primary">