打字稿:_this2.onClick不是一个函数

时间:2018-03-06 17:35:30

标签: javascript typescript react-native typescript2.0 native-base

我使用typescript进行react-native开发。 此处ListListItem来自NativeBase,ListItem就像TouchableOpacity组件。

...
public onClick = () => this.props.navigation.navigate("NextScreen");
public _renderRow = (item: any) {
    return (
        <ListItem onPress={() => this.onClick()}>
             ...
        </ListItem>
    );
}
public render() {
   return(
        <List
            dataArray={this.data}
            renderRow={this._renderRow}
        />
   );
}

当我点击项目时,它会显示以下错误。

  

_this2.onClick不是一个函数。 (在&#39; _this2.onClick()&#39;,&#39; _this2.onClick&#39;未定义)

我认为这是因为onClick()函数没有绑定到组件类。该函数是否在typescript中自动绑定?

我该如何解决这个问题?

1 个答案:

答案 0 :(得分:2)

您需要bind组件类的方法:

public onClick() { 
  this.props.navigation.navigate("NextScreen"); 
}
public _renderRow(item: any) {
    return (
        <ListItem onPress={this.onClick}>
             ...
        </ListItem>
    );
}
public render() {
   return(
        <List
            dataArray={this.data}
            renderRow={this._renderRow.bind(this)} // <---- Here
        />
   );
}