爲什麼我越來越不確定的的console.log在reactJs

Question

我已經派人對象屬性

objValue = { 
    key1 = 'value1', 
    key2 = ['a','b','c','d','e'], 
} 
<childComponent objValue = {objValue} /> 

然後在我的孩子我試圖訪問屬性

class ....{ 
    const {obj} = this.props.objValue, 
    console.log({obj.key2}) 
} 

我錯過了什麼？

Answer 1

的問題是在這條線：

const {obj} = this.props.obj; 

寫這樣的：

const {objValue} = this.props; 

原因是要傳遞的object在props與關鍵objValue，所以你需要爲使用this.props.objValue.key或像這樣解構：

const {objValue} = this.props; 

現在您可以使用objValue.key2它將打印適當的值。

props將是這樣的：

{ 
    objValue: { 
     key1 : 'value1', 
     key2 : ['a','b','c','d','e'], 
    } 
    ..... 
} 

檢查DOC的更多信息，Object destructuring。

一些變化：

的反應成分必須以大寫字母開頭的名稱，否則將被視爲HTML元素還沒有反應過來成分，所以使用ChildComponent，而不是childComponent。

您使用=內object指定值，代替使用:。

檢查這個例子：

var a = {a:1, b:2, c:3}; 
 

 
var {b} = a; 
 

 
console.log(b); 
 

 
console.log({b});

Answer 2

看看你的大成，您使用=的對象，而不是：和Mayank權，組件的名稱應當以大寫字母開頭。

Answer 3

謝謝大家，我實際上發現它在工作中的基礎對象定義中的拼寫錯誤。