1

ReactJS for Rails を操作するために、react-rails gem を使用しています。奇妙なことに、React コンポーネントをレンダリングするときに空でない値のプロパティを設定すると、入力フィールドはキーボード イベントを受け取りません。

これはうまくいきません!

React.DOM.input
  type: 'text'
  className: 'form-control'
  value: "ABC"

しかし、それは動作します

React.DOM.input
  type: 'text'
  className: 'form-control'
  value: ""

アイデアはありますか?どうもありがとう!

4

1 に答える 1

2

これに似た 1 つの質問に回答しましたが、その回答をどのように共有すればよいかわかりません。だから私はそれを再入力しています。

反応では、コンポーネントは状態が変化した場合にのみレンダリングされます。コンポーネントの状態が変わるたびに、対応するコンポーネントがレンダリングされます。つまり、仮想 DOM を新しい値で更新し、それをメイン DOM にアタッチします。それがreactの仕組みです。

入力テキスト フィールドの場合、テキスト フィールドの値は、ユーザーが何らかの値を入力したときにのみ変更されます。この場合、状態を更新するのではなく、テキスト フィールドの「値」プロパティに新しい値を追加します。したがって、反応は何もレンダリングせず、新しい値はDOMに追加されません。ここでは、反応動作に違反しています。そのため、react では入力テキスト フィールドを編集できません。

反応の流れをスムーズにするために、状態を設定するために on change コールバック関数を使用できます。テキストフィールドの値を変更すると、状態が新しい値で設定されるため、反応レンダリングとDOMが新しい値で更新されます。

コールバック関数を使用する代わりに、valuelink プロパティを使用して入力テキストに値を追加できます。お気に入り:

getInitialState: function(){
  return {
   value:'' //for empty text value
  }
}

値リンクの場合、変数値ではなく状態値を指定する必要があります。完全に理解するには、 https ://facebook.github.io/react/docs/two-way-binding-helpers.html を参照してください 。

テキストボックスにテキストを入力するたびに、状態が更新され、入力テキストの値が状態値に設定されます。

于 2016-04-26T17:07:30.920 に答える