[英]React : TypeError: Cannot read property 'value' of undefined
I am getting value from form in ReactJS but in meantime when I click on submit button it give me error TypeError: Cannot read property 'value' of undefined
.我从 ReactJS 的表单中获取值,但同时当我点击提交按钮时,它给我错误
TypeError: Cannot read property 'value' of undefined
。 Could someone Please check what problem I may face .有人可以请检查我可能面临的问题。
Thanks谢谢
import React, { Component } from 'react'
import { getFunName } from './helpers';
class StorePicker extends Component {
myInput=React.createRef();
goToStore=event=> {
// 1- Stopping form from submitting
event.preventDefault();
// 2 - Getting value from Input
const storeName = this.myInput.value.value ;
// 3 - Change the page to /store/whatever-you-entered
this.props.history.push(`/store/${storeName}`)
}
render() {
return (
<form className="store-selector" onSubmit={this.goToStore}>
<h2>Please Enter Enter a Store</h2>
<input type="text" required placeholder="Store Name" ref={this.myInput} defaultValue={getFunName()}/>
<button type="submit">Visit Store</button>
</form>
)
}
}
export default StorePicker;
如果你使用 refs,它应该是这样的:
const storeName = this.myInput.current.value;
Complete code for this完整代码
import React, {Fragment} from 'react';
import {getFunName} from "../helpers";
class StorePicker extends React.Component{
myInput = React.createRef();
goToStore = event =>{
//1. Stop the from submitting
event.preventDefault();
//2. get the text from that input
const storeName = this.myInput.current.value;
//3. change the page to /store/store-name
this.props.history.push(`/store/${storeName}`);
}
render(){
return(
<form className="store-selector" onSubmit={this.goToStore}>
<h2>Please Enter a Store</h2>
<input type="text" ref={this.myInput} required placeholder="Store Name"/>
<button type="submit">Visit Store</button>
</form>
)
}
}
export default StorePicker;
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.