亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

類型錯誤:無法讀取未定義的屬性“telephoneno”

類型錯誤:無法讀取未定義的屬性“telephoneno”

婷婷同學_ 2023-05-11 13:23:44
我正在 React JS 上嘗試一個簡單的程序,代碼如下class Employee extends Component {    constructor() {        super();        this.state = {            name: '',            address: '',            city: '',            telephoneno: '',            stdcode: ''                                }        // Other event handlers goes here        this.handlePhoneNoChange = this.handlePhoneNoChange(this);    }    handlePhoneNoChange(event) {         this.setState({ telephoneno: event.target.telephoneno });    }    render() {        return (            <center>                <div>                    <div class="input-group input-group-sm w-50">                        <div class="input-group-prepend">                            <span class="input-group-text" id="basic-addon1">Phone No</span>                        </div>                                                        <input type="text" class="form-control" placeholder="Phone No" id="phoneno" aria-label="PhoneNo" aria-describedby="basic-addon1" onChange={ this.handlePhoneNoChange } value={ this.state.telephoneno } /><br/>                    </div><br/>                            </div>              </center>        );    }} export default Employee;它與'TypeError: Cannot read property 'telephoneno'未定義的錯誤。我試圖在這里理解這個概念。為什么它只報告“telephoneno”錯誤而不報告其他字段?我究竟做錯了什么 ?
查看完整描述

3 回答

?
紅糖糍粑

TA貢獻1815條經驗 獲得超6個贊

問題是這一行:

this.handlePhoneNoChange?=?this.handlePhoneNoChange(this);

如果你仔細觀察,你就不見了.bind。因此,您將其稱為this事件。您的組件中沒有target屬性,因此會引發錯誤。

錯誤的修復是:

this.handlePhoneNoChange?=?this.handlePhoneNoChange.bind(this);

但是,它不會解決其他答案中突出顯示的問題。

查看完整回答
反對 回復 2023-05-11
?
慕田峪4524236

TA貢獻1875條經驗 獲得超5個贊

event.target.value基本上檢索調用它的任何輸入的值。


在這種情況下,可以通過 event.target.value 訪問telephoneno輸入的值


所以,使用事件的正確方法是,


handlePhoneNoChange(event) { 

   this.setState({ telephoneno: event.target.value });

}

你應該像這樣綁定它,


this.handlePhoneNoChange = this.handlePhoneNoChange.bind(this);

如果您可以在輸入的 onChange 事件中使用箭頭函數,那就更好了,


onChange={ (e) => this.handlePhoneNoChange(e) }


查看完整回答
反對 回復 2023-05-11
?
揚帆大魚

TA貢獻1799條經驗 獲得超9個贊

您沒有使用正確的方式在反應有狀態組件中使用狀態,在和函數props中用作參數constructorsuper


? constructor(props) {


? ? ? ? super(props);


? ? ? ? this.state = {

? ? ? ? ? ? name: '',

? ? ? ? ? ? address: '',

? ? ? ? ? ? city: '',

? ? ? ? ? ? telephoneno: '',

? ? ? ? ? ? stdcode: ''

? ? ? ? ? ? ? ? ? ? ? ??

? ? ? ? }

? }


并更新這一行:

this.setState({ telephoneno: event.target.value});

查看完整回答
反對 回復 2023-05-11
  • 3 回答
  • 0 關注
  • 195 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號