首页 > 解决方案 > 在函数内调用函数时 React 的范围问题

问题描述

在使用 React 时调用函数内的函数时,我在维护范围方面遇到了一些困难,我创建了一个 onChange 函数,该函数调用另一个名为 buildBookingQuery 的函数

handlePerPageChange = (data) => {
    const elementsIndex = this.state.filters.findIndex(element => element.id == 1)
    let newArray = [...this.state.filters]
    newArray[elementsIndex] = {...newArray[elementsIndex], perPage: parseInt(data.target.value)}
    this.setState({
        filters: newArray
    })
    console.log(this.state.filters[0])
    console.log(newArray)

    let query = this.buildBookingQuery() => This is the problem function
    console.log(query)
}

我的 buildBookingQuery 功能

buildBookingQuery (){
    let page = 1
    let orderby = this.state.filters[0].orderby.split(" ")
    let from = this.state.filters[0].fromDate
    let to = this.state.filters[0].toDate
    let reservedFrom = this.state.filters[0].reservedFromDate
    let reservedTo = this.state.filters[0].reservedToDate

    console.log("Build Booking Query:", from) => getting undefined

    // rest of code removed for sake of brevity 
    return someValue 
}

通过研究,我已将绑定事件添加到构造函数

this.buildBookingQuery = this.buildBookingQuery.bind(this);

但无济于事。

感谢您的帮助

标签: javascriptreactjs

解决方案


将您的buildBookingQuery功能更改为箭头功能,并删除绑定。


推荐阅读