React 元件的三大屬性之refs

2021-10-24 19:25:51 字數 916 閱讀 5597

獲取input輸入框中的值(分為兩種情況):

1. 僅獲取input輸入框的值,該input不存在事件發生

handleclick()
2. 獲取存在事件發生的input元素的值(利用形參event)

handleblur(event)
所有**:

import react from 'react';

class add extends react.component

this.handleclick = this.handleclick.bind(this)

}handleclick()

handleblur(event)

render()

this.input = input}/> 

提示輸入內容);}

}export default add;

可能疑問點:在獲取存在事件發生的input元素的值時,沒有用到this,還需要在constructor中將新增函式中的this強行繫結為元件物件嘛?

並且本人在沒有繫結的情況下,也可以獲取到input元素的值。但是,handleblur方法中的this為undefined。

大家在看到我的**之後,也就看到了我沒有在constructor中給handleblur方法中的this強行繫結,原因是我在實現這一功能時沒有用到this,但是若後邊在該方法中使用到this的話,必須要進行繫結

React的元件三大屬性之state

學習過程中編寫的 和筆記 import react from react class like extends react.component 將新增方法中的this 強制繫結為元件物件 難點 this.handleclick this.handleclick.bind this 新新增的方法 內部...

React 元件的三大屬性之props

props的理解 每個元件物件都會有props properties的簡寫 屬性 元件標籤的所有屬性都儲存在props中。props的作用 通過標籤屬性從元件外向元件內傳遞變化的資料 注意點 元件內部不要修改props資料。fun.js import react from react 1.建立元件 ...

07 React 元件三大屬性 refs

需求 自定義元件,功能說明如下 1.介面如頁面所示 2.點選按鈕,提示第乙個輸入框中的值 3.當第2個輸入框失去焦點時,提示這個輸入框中的值 第一步,初始化靜態元件,並渲染元件標籤 第二步,做互動,點選按鈕彈出輸入框中的值,以及失去焦點是彈出輸入框中的值 前者操作的dom元素和觸發事件的元素不是同乙...