學習React實戰-打造畫廊應用學習中遇到的問題(react組件初始化時數組生成的問題)
問題描述如下： 學習React實戰-打造畫廊應用課程，然后我就用create-react-app構建了項目，項目地址
https://github.com/joyjoe/gallery-by-react
現在遇到的問題是這樣的，項目啟動時，需要設置所有圖片的初始位置狀態信息。這個信息應該是一個數組，數組中的每一項都應該是一個對象，包含一個position屬性。但是數組的長度是根據圖片的個數確定的。于是我在gallery組件的構造函數中使用了for循環來創建數組。代碼如下：
let?len?=?imagesData.length;
var?arr?=?new?Array(len);
for(var?i?=0;?i?<?len?;?i++){
//?arr.push({"position":{}});
arr[i]?=?{"position":{}};
}
console.log("arr");
console.log(arr);
this.state={
"imagePosDataArr":?arr
};其中 imagesData是從Json文件中加載而成的一個數組對象。
運行之后，我發現arr打印出來時，其中會有幾個元素又是一個array類型對象。
我就很納悶了。這是為什么呢？為什么這里會出現數組的嵌套呢？
自己對比了一部分代碼，發現可能的原因應該是我在render函數中操作了this.state.imagePosDataArr對象，然后就會發現arr數組有嵌套。 于是，我在render函數中刪掉與state有關的代碼，再看結果，發現arr數組沒有嵌套了。 不知道這是為什么？
2017-11-01
你定義了 pos 參數，使用的代碼在哪里？沒有使用的代碼嗎？可否貼一下執行出錯的代碼，而不是注釋后的。
2017-11-01
找到原因了，真是坑呀。在 placeImage()方法中操作數組時，用splice方法返回的是數組，然后沒注意，就直接將數組又用splice方法給塞進去了。這個地方應該是把前面的數組給展開。
2017-11-01
就是如圖所示一樣的調用，我在render函數中的forEach遍歷回調中獲取了state，然后將state值傳遞給子組件ImageFigure的pos屬性中。
問題就出在這里，我前面在構造函數中生成的初始化數據數組arr里面有嵌套數組，不知道是為什么造成的，感覺和setState是異步實現的機制有關，每次都是數組中某個索引對應的值被嵌入到另一個數組中了。