javascript - 作为 prop 传递的函数在子组件中未定义,但在 props 对象中可见
问题描述
我将几个函数作为道具传递给子组件,但onSubmit
我传递的函数在子组件中未定义。但是,如果我登录this.props
子组件,我可以看到它onSubmit
已定义。
我传递的其他功能都工作正常,所以我不确定问题出在这个功能上。
这是有问题的onSubmit
功能:
onSumbit = (event) => {
const {
email, passwordOne, name, schedule,
} = this.state;
const createUserData = (authUser) => this.props.firebase
.user(authUser.user.uid)
.set({
type: 'Venue',
});
const createVenueData = (authUser) => {
const placeLocation = this.state.place.geometry.location;
const placeAddress = this.state.place.address_components;
if (!placeLocation) {
return Promise.reject(
new Error('No coordinates for location, please use Google Autocomplete to select address'),
);
}
return this.props.firebase.venues().add({
uid: authUser.user.uid,
email: authUser.user.email,
name,
schedule: JSON.parse(schedule),
address: placeAddress,
coordinates: new this.props.firebase.firestore
.GeoPoint(placeLocation.lat(), placeLocation.lng()),
});
};
this.props.firebase
.doCreateUserWithEmailAndPassword(email, passwordOne)
.then((authUser) => Promise.all([createUserData(authUser), createVenueData(authUser)]))
.then(() => {
this.setState({ ...INITIAL_STATE });
this.props.history.push(ROUTES.HOME);
})
.catch((error) => {
this.setState({ error });
});
event.preventDefault();
}
这是我传递的父组件中的渲染函数onSubmit
:
render() {
console.log("ON SUBMIT");
console.log(this.onSumbit);
console.log(this.handleInputChange);
return (
<SignUp
handleInputChange={this.handleInputChange}
validate={this.validate}
validationSchema={signUpSchema}
onSumbit={this.onSumbit}
addressRef={this.addressRef}
error={this.state.error}
/>
);
}
解决方案
推荐阅读
- c# - 将文件读入类型大于字节的结构
- python - 如何使用嵌套 for 循环添加两个矩阵?
- c# - 找不到扩展方法?
- python - 当我使用生成器表达式和迭代器从网格上的常规网格插入数据时收到 MemError >2000 次
- python-3.x - 如何使用额外的共享变量连接具有多个重叠时间戳的两个 DataFrame
- mysql - Fuelphp在按钮单击时下载csv?
- html - Bootstrap 4 导航栏不会折叠
- sabre - OTA_HotelResRQ 因 GUARANTEE NOT ACCEPTED 而失败
- c# - Try Catch 不起作用 Firebase 存储 [Unity]
- android - React Native Native Java/Android 模块 - 不显示 toast 消息