0
thisのリアクションバージョンを作成しようとしています。コンポーネントを更新するときに入力要素が更新されない
これまでの内容はthis Codepenです。
ここで問題となるのは、「疑わしいプレーヤー」列の下にあるテキストフィールドに入力し、その行を削除するために隣接する名前（「ロール」列の下）をクリックすると、テキストが入力内に残ることです次に、別の名前に隣接しています。
期待された動作は、名前をクリックして行を削除し、要素（名前とテキストの入力）が両方とも消えることです。
クラスの状態でchecklistという配列に格納されています。
テーブル内の各リスト項目の構成要素はこれです：あなたが名前をクリックすると
class RoleCheckpoint extends React.Component {
constructor() {
super();
this.state = {
text: ""
};
}
deleteThis() {
this.props.removeRole(this.props.role.id);
}
onChange(e) {
this.setState({
text: e.target.value
});
}
render() {
console.log(this.props);
return (
<tr>
<td className="vertAlign remove noselect" onClick={this.deleteThis.bind(this)}>
{this.props.role.el}
</td>
<td>
<input type="text" className="form-control" spellCheck="false" onChange={this.onChange.bind(this)} value={this.state.text} />
</td>
</tr>
);
}
}
それはそれが経由する順番にRoleListのremoveRole機能を呼び出すコンポーネントdeleteThis機能を、（呼び出しリストアイテムの配列を取得し、一致するIDを持つものをコンポーネントの状態から削除します。これはRoleCheckpointの小道具として渡されます。
私はdeleteThis機能でthis.forceUpdate()を使用して試した、とあなたが見ることができるように私は、入力フィールドのvalue（textと呼ばれる）のコンポーネントの状態に結合しようとした、まだ部品を取り外すとき、まだ入力が更新されません。 DOMから。
さらに詳しい説明が必要な場合は、私はそれを提供していただければ幸いです。