2017-01-26 30 views
0

每次單擊按鈕時,都需要添加一個輸入框(input-0,input-1 ...)。以下是相關的代碼。e.target.value在添加動態輸入數據時反應不明確

//國家

 this.state = { 
     newText: {} 
     }; 

//代碼添加動態輸入文本

 addInputText =() => { 
     let dynamicTextsNo = Object.keys(this.state.newText).length; 
     let newInputId = dynamicTextsNo+1; 
     let dynamicTextArr = this.state.newText; 
     let newTextId = 'input-'+dynamicTextsNo; 
     dynamicTextArr[newTextId] = ''; 
     let newState = { ...this.state, newText: dynamicTextArr } 
     this.setState(newState); 
     } 

//代碼來呈現動態輸入文本。

 dynamicTextArea =() => { 
     return Object.keys(this.state.newText).map((key) => { 
      return (<InputGroup key={key} borderType='underline'> 
         <Input placeholder='Type your text here' value={this.state.newText[key]} onChange={this.changeInput}/> 
        </InputGroup> 
       ); 
     }); 
     } 

//渲染功能

 render() { 
     return <View>{this.dynamicTextArea()}</View> 
     } 

//處理輸入

changeInput = (e) => { 
    console.log(e.target.value); // **this comes out to be undefined.** 
    } 

爲什麼e.target.value在changeInput功能未定義?

P.S.完整代碼的jsfiddle鏈接:https://jsfiddle.net/johnnash03/9by9qyct/1/

+0

你可以上傳你的代碼JSFiddle.net好嗎?這會讓你更容易地幫助你調試你的問題。 –

+0

@KennyMeyer我已提供完整代碼 –

+0

@johndoe的鏈接,我將您的代碼改編爲:https://jsfiddle.net/mrlew/gk55wLx1/。但changeInput沒有錯誤。檢查控制檯。 – mrlew

回答

0

您必須使用bind像這樣<Input placeholder='Type your text here' value={this.state.newText[key]} onChange={this.changeInput.bind(this)}/>

+0

綁定後仍然未定義。 –

2

不同的瀏覽器中輸入文本元素,則event參數傳遞反應原住民TextInput.onChange回調沒有一個叫target屬性。

相反,使用

<TextInput 
    onChange={(event) => event.nativeEvent.text} 
/> 

<TextInput 
    onChangeText={(text) => text} 
/>