ReactJs：textarea的默认值未更新
ReactJs：textarea的默认值未更新
我正在开发一个ReactJs应用中的表单。我想要做的是：
1/ 通过id从一组草稿信件中选择一封草稿信件 //没问题
2/ 在下方的表单中显示所选草稿信件的标题、内容和位置 //没问题
3/ 然后用户应该能够编辑所有的字段 //有问题！
这是我所做的：
class NewLetter extends Component {
constructor(props) {
super(props)
this.state = {
city: "",
title: "",
letterBody: "",
}
this.handleChange_city = this.handleChange_city.bind(this);
this.handleChange_letterBody = this.handleChange_letterBody.bind(this);
this.handleChange_title = this.handleChange_title.bind(this);
}
handleChange_city(e) {
this.setState({
city: e.target.value
});
}
handleChange_letterBody(e) {
this.setState({
title: e.target.value
});
}
handleChange_title(e) {
this.setState({
letterBody: e.target.value
});
}
render() {
return (
)
}
}
export default NewLetter
如果我使用value，字段是不可编辑的
如果我使用defaultValue，字段是可编辑的，但是当defaultValue改变时，React不会重新渲染。这些值是由父组件传递的props：
class DraftLetters extends Component {
constructor(props) {
super(props)
this.state = {
selectedDraftIndex: 0,
};
this.handleChange = this.handleChange.bind(this);
}
getListOfDrafts = () => {
var list = []
for (let i = 0; i < this.props.drafts.length; i++) {
list.push();
}
return (list);
}
handleChange(e) {
this.setState({
selectedDraftIndex: e.target.value,
})
}
render() {
return (
{(this.props.drafts.length != 0) &&
}
{(this.props.drafts.length == 0) &&
You haven't saved any draft.
}
{(this.props.drafts.length != 0) &&
这似乎是一个众所周知的问题
这是我找到的：
defaultValue change does not re-render input
React input defaultValue doesn't update with state
https://github.com/facebook/react/issues/4101
现在是否有解决这个问题的方法？