React handleChange語法

Question

我在React代碼中有一個handleChange函數，我只是想知道語法。

handleChange: function(event){ 

    var newState = {};    
     newState[event.target.id] = event.target.value; 
    this.setState(newState); 
}, 

我的問題是，如果var newState是一個空的對象，event.target.id看起來像是被放進一個數組（[ ]）旁邊的空對象，當你把一個對象接下來發生的一個數組是什麼？我甚至正確地讀這個嗎？

Answer 1

我是否正確地讀這個？

不。這是標準的bracket notation訪問對象。

如果event.target.id是「a」，那麼該對象將如下所示：{a: event.target.value}。

Answer 2

someobject[...]語法是property accessor syntax - 它相當於使用someobject.someproperty，除了將被訪問的屬性的名稱是方括號內的表達式的值。

例如，如果event.target.id的值爲'name'對於特定呼叫，那麼handleChange()方法將執行相當於this.setState({name: event.target.value})。

Answer 3

所以在上面的代碼

newState是一個空的對象，newState[event.target.id]是辦法訪問obejct參數，所以如果我們這樣做

handleChange: function(event){ 

    var newState = {};    
     newState[event.target.id] = event.target.value; 
    this.setState(newState); 
}, 

我們的價值event.target.value assiging對象的屬性，它如果它不存在，則爲event.target.id。假設如果event.target.id是"name"和event.target.value是"Mike"。新狀態將變爲

newState = { 
    name: "Mike" 
}