这个数值在功能空（阵营-母语） [英] this value is null in function (React-Native)

问题描述

根据本地测试，这似乎是空内的行渲染功能。因此，此prevents我从上preSS道具结合局部功能。

As per local testing, 'this' seems to be null inside the row render function. As a result this prevents me from binding a local function on the onPress prop.

我有这样的渲染块：

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

和局部功能

_visitEntryDetail() {
    console.log('test');
}

再行呈现

_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>
    );
}

这将返回

message: null is not an object (evaluating 'this.$FileList_visitEntryDetail')"

选中本上renderRow更换code以上时使用返回null：

checking "this" on renderRow returns null when replacing code above with:

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

与以下控制台输出：

with following console output:

RCTJSLog> null

但罚款时，

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]

可有人请指出是什么导致了这一点。谢谢你。

Can someone please point out what's causing this. Thanks.

推荐答案

这个为null，因为 _renderRow 还没有被绑定到当前类。请记住：

this is null because _renderRow has not been binded to the current class. Please keep in mind:

在构造函数中，你需要显式绑定功能，如果你想将它传递给任何反应成分，的为有时不绑定隐含的

In constructor, you need to explicitly bind a function, if you want to pass it to any react component, as sometimes it doesn't bind implicitly.

本声明适用于任何函数传递给该组件。例如，你要调用一个函数 callThisFunction 上pressing TouchableHighlight 。您可以通过其绑定：

This statement applies to any function being passed to the component. For example, you want to call a function callThisFunction on pressing TouchableHighlight. You can bind it by:

class SomeComponent extends Component {

    constructor(props) {
    super(props);

    //binding function
    this.renderRow = this.renderRow.bind(this);
    this.callThisFunction = this.callThisFunction.bind(this);
    }

   renderRow() {
    console.log(this); //not null now
    return (
    <View>
    <TouchableHighlight onPress={this.callThisFunction}>
    <Image source={require('image!prev')}/>
    </TouchableHighlight>
    </View> 
    );
    }

    callThisFunction() {
     console.log(this); //not null now
    }

}

这篇关于这个数值在功能空（阵营-母语）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！