回覆列表
  • 1 # 使用者6624095874536

    題主剛學前端的吧,剛用上用react,應該是瞭解了下DOM然後用起react有這樣的疑問。不過沒事,慢慢來。

    怎麼說呢,兩個input框在彼此的事件繫結裡獲取對方的值,在react裡是很容易做到的,不需要透過獲取兄弟節點的value值來做。

    v16.8之前

    可以在Class Component裡定義兩個state:inputValue1、inputValue2

    在事件繫結的時候,透過setState把e.target.value值賦給預先定義好的state,兩個state即作為兩個input的value

    在彼此的事件繫結裡,藉由this.state.inputValue就可以獲取彼此的value值

    v16.8之後

    使用hooks進行內部狀態管理,這樣和上方的形式類似,只不過,state就不用透過this獲取上下文,而是在元件內上下文就可以取到,而寫在元件裡的方法,很容易透過上下文取到這兩個value。

    走DOM形式獲取,也可以使用useRef就可以獲取兩個input的當前例項也很好拿到它的value

    總的來講,使用React後,和DOM操作的思路會不一樣,因為React元件內“DOM”就是自己組裝的,而這裡的“DOM”,React會稱之為“Virtual DOM”。不同就是,以前是寫好HTML結構後用js、jQuery去操作DOM以達到目標效果;現在,在DOM生成之前,你可以去新增事件繫結、值繫結等,而這樣的好處就是走上下文就可以獲取到各種繫結值,而不用透過DOM獲取元素value的形式

  • 中秋節和大豐收的關聯?
  • 德雲社的相聲專場為什麼能開幾萬人的場子?坐在後排的觀眾會過癮嗎?