React Native Input 不允许编辑值
React Native Input not allowing edit value
我使用本机基础创建了一个输入,但我无法编辑该值。它一直显示相同的值。
render() {
const {
FirstName, LastName, Email, Phone, Unit, MiddleName
} = this.state.MyData;
...
<Input
value={LastName}
onChangeText={val => this.setState({ LastName: val })}
style={styles.valueText}
/>
...
它的值为'Smith'。当我点击输入时,它不允许我删除或添加字符。
谢谢
您不是更新对象,而是向状态添加新值,在输入值输入后您的状态变为。
state = {
MyData: {...},
LastName: ...
}
改为更新对象
onChangeText = (text, input) => {
const obj = { ...this.state.MyData };
obj[input] = text;
this.setState({
MyData: obj
})
};
<Input
value={LastName}
onChangeText={(text) => this.onChangeText(text, 'LastName')}
style={styles.valueText}
/>
现在您可以使用代码了
import React, { Component } from 'react';
import { AppRegistry, TextInput } from 'react-native';
export default class UselessTextInput extends Component {
constructor(props) {
super(props);
this.state = { text: 'Useless Placeholder' };
}
render() {
return (
<TextInput
style={{height: 40, borderColor: 'gray', borderWidth: 1}}
onChangeText={(text) => this.setState({text})}
value={this.state.text}
/>
);
}
}
我使用本机基础创建了一个输入,但我无法编辑该值。它一直显示相同的值。
render() {
const {
FirstName, LastName, Email, Phone, Unit, MiddleName
} = this.state.MyData;
...
<Input
value={LastName}
onChangeText={val => this.setState({ LastName: val })}
style={styles.valueText}
/>
...
它的值为'Smith'。当我点击输入时,它不允许我删除或添加字符。
谢谢
您不是更新对象,而是向状态添加新值,在输入值输入后您的状态变为。
state = {
MyData: {...},
LastName: ...
}
改为更新对象
onChangeText = (text, input) => {
const obj = { ...this.state.MyData };
obj[input] = text;
this.setState({
MyData: obj
})
};
<Input
value={LastName}
onChangeText={(text) => this.onChangeText(text, 'LastName')}
style={styles.valueText}
/>
现在您可以使用代码了
import React, { Component } from 'react';
import { AppRegistry, TextInput } from 'react-native';
export default class UselessTextInput extends Component {
constructor(props) {
super(props);
this.state = { text: 'Useless Placeholder' };
}
render() {
return (
<TextInput
style={{height: 40, borderColor: 'gray', borderWidth: 1}}
onChangeText={(text) => this.setState({text})}
value={this.state.text}
/>
);
}
}