[問題] React submit時取得欄位的值

看板Ajax作者 (重出江湖)時間7年前 (2017/03/13 00:43), 編輯推噓2(202)
留言4則, 1人參與, 最新討論串1/2 (看更多)
請教各位 https://facebook.github.io/react/docs/forms.html 小弟在練習官網範例時有個問題 我想試著做一個像是條件查詢的網頁 當然父元件就是畫面中查詢條件的部份 子元件就是顯示資料的部份 我想試著在按下submit的時候去抓到查詢欄位的值 然後在傳給子元件去顯示 像是這樣 return ( <form onSubmit={this.handleSubmit}> <label> Name: <input type="text" /> </label> <input type="submit" value="Submit" /> <displaytable name={this.state.value} /> </form> ); 但是官網form的範例等於是會在onChange時一直覆蓋原來在state的值 也只能靠這樣才能讓key進去的字正常顯示在input中 所以我想這應該不是適用於此的方法 應該是在按下submit時才去取得各欄位的值 我試過用refs 但在chrome可以看到值 卻不能assign給變數 所以想請問各位能否提示一下正確的作法 正常的作法都是怎麼處理這問題呢? 謝謝 -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 118.233.159.254 ※ 文章網址: https://www.ptt.cc/bbs/Ajax/M.1489336986.A.2AA.html

03/22 20:35, , 1F
正常應該都是input加個onchange event然後把值存到state
03/22 20:35, 1F

03/22 20:35, , 2F
,之後submit再從state裡面去處理。
03/22 20:35, 2F

03/22 20:37, , 3F
補充,可以在state裡面加一個boolean來決定子元件要不要
03/22 20:37, 3F

03/22 20:37, , 4F
更新或顯示,最後submit時,把他改成true就好
03/22 20:37, 4F
文章代碼(AID): #1OnNgQAg (Ajax)
文章代碼(AID): #1OnNgQAg (Ajax)