javascript - 在函数内调用函数时 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);
但无济于事。
感谢您的帮助
解决方案
将您的buildBookingQuery
功能更改为箭头功能,并删除绑定。
推荐阅读
- reactjs - 对相互取消的状态进行 2 次更改而不重新触发 useEffect
- docker - 尝试在容器化的 Jenkins 中将图像推送到 DockerHub
- java - 如何在密码字段中显示被屏蔽的单词密码?
- python - 合并具有重叠行和不同列的多个数据框
- scheme - 如何以方案 r5rs 语言将以下内容打印到控制台
- gml - GML 当分辨率不是全屏并且您交换分辨率时,游戏不会在屏幕上居中
- vue.js - 更改 v-list-group 中的默认颜色
- c# - 在不总是使用这些组件时将 AMP 组件添加到页面
- sql - oracle sql触发器编译
- excel - 如何在不同的位置将两个工作表保存为 pdf?