const javascript 中的调用函数反应本机

Question

我是 React Native 和 javascript 的新手。我来自 java 和 android dev。我想在 const 中调用一个函数，但无论我尝试什么方式，我都会收到一大堆错误。

我遇到错误：

this.collectionUpdate is not a function

主屏幕：

 onCollectionUpdate = (doc) => {
    const items = [];

    doc.forEach((doc)=> {
        console.log("doc received");
        const {Name, imageDownloadUrl,Location} = doc.data();

        items.push({
            key: doc.id,
            doc, //DocumentSnapshot
            Name,
            imageDownloadUrl,
            Location,

        });
    });

    this.setState({
        items,
        loading: false,
    });
}




componentDidMount() {

    const geoQuery = geoFirestore.query({
        center: new firebase.firestore.GeoPoint(10.38, 2.41),
        radius: 10.5
    });

    const onReadyRegistration = geoQuery.on('ready', () => {
        console.log('GeoFirestoreQuery has loaded and fired all other events for initial data');
    });


    const onKeyEnteredRegistration = geoQuery.on('key_entered', function(key, doc, distance) {
        console.log(key + ' entered query at ' + doc.coordinates.latitude
            + ',' + doc.Name
            + ',' + doc.coordinates.longitude
            + ' (' + distance + ' km from center)')

        this.onCollectionUpdate(doc)



    });

    this.onCollectionUpdate = this.onCollectionUpdate.bind(this);
}

我知道这可能对我不起作用，因为我对 java 脚本的了解还不足以理解我做错了什么，但是，我很快就会开始在 Javascript 中学习课程以获得更好的理解。但我会非常感谢任何能告诉我哪里出错的人。我觉得这是因为我试图在 const 中调用函数？

Answer 1

这不是关于 const，而是关于 function。使用关键字 function 编写的函数会为 this 创建一个新作用域。当您在 function 内部使用 this 时，您看到的是与外部不同的 this。

geoQuery.on('key_entered', function(key, doc, distance) {
    this.onCollectionUpdate(doc) // wrong "this"
})

一个简单的解决方法是在这里使用 => 函数：

geoQuery.on('key_entered', (key, doc, distance) => {
    this.onCollectionUpdate(doc) // correct "this"
})

const javascript 中的调用函数反应本机

Call Function within const javascript react native

javascript

firebase

reactjs

geofire

react-native