Listview 此值在函数中为空（React Native）

根据本地测试，“this”在row render函数中似乎为null。因此，这会阻止我在onPress道具上绑定本地函数

我有这个渲染块：

render() {
    return (
        <ListView
            dataSource={this.state.dataSource}
            renderRow={this._renderRow}
            renderHeader={this._renderHeader} 
            style={styles.listView} />
    );
}

然后行渲染

_renderRow(something) {
    return (
        <TouchableHighlight
            style={[styles.textContainer, filestyle.container]} 
            onPress={this._visitEntryDetail.bind(this)} >
            <View>
                <Text style={filestyle.text1} >{something.detail}</Text>
                <Text style={filestyle.text2} >{something.size}, {something.timestamp}</Text>
            </View>
        </TouchableHighlight>
    );
}

在renderRow上选中“this”会在将上述代码替换为以下代码时返回null：

_renderRow(file) {
    console.log(this);
    return (
        <TouchableHighlight
            style={[styles.textContainer, filestyle.filelistcontainer]} 
             >

但是当

render() {
    console.log('inside render. this value is below me');
    console.log(this);
    return (
        <ListView

---

有人能指出这是什么原因吗。谢谢。

此

为空，因为

\u renderRow

尚未绑定到当前类。请记住：

在构造函数中，若要将函数传递给任何react组件，则需要显式绑定函数，因为有时它不会隐式绑定

此语句适用于传递给组件的任何函数。例如，您想在按下触摸屏突出显示时调用函数

callThisFunction

。您可以通过以下方式进行绑定：

class SomeComponent扩展组件{
建造师（道具）{
超级（道具）
//结合功能
this.renderRow=this.renderRow.bind（this）
this.callThisFunction=this.callThisFunction.bind（this）
}
renderRow（）{
console.log（this）//现在不为null
返回(
)
}
callThisFunction（）{
console.log（this）//现在不为null
}
}

NightFury解决方案的替代方案是使用语法，而不必手动绑定构造函数中的函数。您的

render（）

将如下所示：

render() {
    return (
       <ListView
           dataSource={this.state.dataSource}
           renderRow={() => this._renderRow()}
           renderHeader={() => this._renderHeader()} 
           style={styles.listView} />
    );
}

render（）{
返回(
这是.\u renderRow（）}
renderHeader={（）=>这个
style={styles.listView}/>
);
}

如果要将函数传递给第三方组件，请始终传递如下函数：

        <Carousel
          renderItem={item => this._renderItem(item)}
        />

this.\u renderItem（项目）}
/>

---

当你像那样绑定函数时，它没有丢失其他类中的函数实例

使代码在上面工作：renderRow={（file）=>'null'不是对象（计算'\u this3.pressRow'）谢谢，节省了我的时间+1非常感谢你，你为我节省了很多时间！不幸的是，ListView示例中没有提到它：这也解决了我的问题。我和@melihmuck有同样的问题。因此，这只有在使用ListView时才是独占的？@Larney您可以尝试在

componentWillMount

中进行绑定，就像这样->

this.myFunc=（）=>this.myFunc（prop1，prop2）

render() {
    console.log('inside render. this value is below me');
    console.log(this);
    return (
        <ListView

RCTJSLog> "inside render. this value is below me"
RCTJSLog> [object Object]

render() {
    return (
       <ListView
           dataSource={this.state.dataSource}
           renderRow={() => this._renderRow()}
           renderHeader={() => this._renderHeader()} 
           style={styles.listView} />
    );
}

        <Carousel
          renderItem={item => this._renderItem(item)}
        />