Javascript 如何将创建的函数中的对象数组复制到Vue中的数据

我创建的钩子中有一个名为tempArray的对象数组，它是在firebase从firestore返回数据时创建的。阵列的外观应类似于：

[{name: "some value", description: "some value", imageSrc: "some value"}, {name: "some value", description: "some value", imageSrc: "some value"} ...]

[{name: "Getter & Setter", description: "Getter & Setter", imageSrc: "Getter & Setter"...]

当我尝试将此数组复制到数据函数中名为orgArray的空数组时，就会出现问题。键被正确复制，但值都被“Getter&Setter”替换。因此，生成的数组如下所示：

[{name: "some value", description: "some value", imageSrc: "some value"}, {name: "some value", description: "some value", imageSrc: "some value"} ...]

[{name: "Getter & Setter", description: "Getter & Setter", imageSrc: "Getter & Setter"...]

以下是完整的代码：

<script>
import Navigation from './components/Navigation';
import * as firebase from 'firebase/app';
import 'firebase/auth';
require("firebase/firestore");



export default {
  components: {
    Navigation
  },
  data: function(){
    return{
      user: true,
      orgArray: []
    }
  },
  created: function(){
    var self = this;
    var db = firebase.firestore();
    var tempArray = [];

    firebase.auth().onAuthStateChanged(function(user) {
      if(user){
         self.$nextTick(function(){
          self.user = 'true';
        })
      }
    })

    db.collection("organizations").get().then(function(querySnapshot) {

    querySnapshot.forEach(function(doc) {
        // doc.data() is never undefined for query doc snapshots
        tempArray.push(doc.data())
        //console.log(doc.id, " => ", doc.data());
    });
    self.orgArray = tempArray;
    console.log(self.orgArray)
});


  }
}
</script>

从“./components/Navigation”导入导航；
从“firebase/app”导入*作为firebase；
导入“firebase/auth”；
要求（“消防基地/消防仓库”）；
导出默认值{
组成部分：{
航行
},
数据：函数（）{
返回{
用户：真，
orgArray:[]
}
},
已创建：函数（）{
var self=这个；
var db=firebase.firestore（）；
var tempArray=[]；
firebase.auth（）.onAuthStateChanged（函数（用户）{
如果（用户）{
self.$nextTick（函数（）{
self.user='true'；
})
}
})
db.collection（“组织”）.get（）.then（函数（querySnapshot）{
querySnapshot.forEach（函数（doc）{
//对于查询文档快照，doc.data（）从来都不是未定义的
tempArray.push（doc.data（））
//console.log（doc.id，=>，doc.data（））；
});
self.orgArray=tempArray；
console.log（self.orgArray）
});
}
}

我尝试直接从forEach函数填充orgArray，而不是填充tempArray并复制内容。我尝试映射这两个数组，循环遍历对象并逐个填充第二个数组，等等

---

任何帮助都将不胜感激。提前谢谢

这可能是javascript异步特性的一个例子。tempArray的console.log是否在

forEach

循环中工作？是的，

forEach

循环中的控制台日志工作正常。我还尝试记录tempArray的值，上面的代码记录self.orgArray，它输出正确的数组。因此，在尝试复制阵列之前，阵列已正确填充。我还将

tempArray.push（doc.data（））

替换为

self.orgArray.push（doc.data（））

，它应该以填充tempArray的相同方式填充该数组。出于某种原因，这些键被复制得很好，但这些值永远不会起作用。我还可以在创建的块中完美地复制阵列。我无法将其从该块中复制出来。如果在块外声明

self.orgArray=[]

并在forEach循环中类似于

tempArray.push（doc.data（））

，该怎么办？

console.log（self.orgArray）

下面的

console.log（tempArray）

也可以工作吗？所有的console-log语句都可以正常工作。正如我在上一篇评论中提到的，我确实尝试直接推送到orgArray。结果是一样的。在创建的块中，我可以命名任何数组，并从一个数组复制到另一个数组。关键问题是将一个数组从创建的块内复制到数据函数内的数组。检查这个线程：看看这是否有帮助？这可能是javascript的异步性质。tempArray的console.log是否在

forEach

循环中工作？是的，

forEach

循环中的控制台日志工作正常。我还尝试记录tempArray的值，上面的代码记录self.orgArray，它输出正确的数组。因此，在尝试复制阵列之前，阵列已正确填充。我还将

tempArray.push（doc.data（））

替换为

self.orgArray.push（doc.data（））

，它应该以填充tempArray的相同方式填充该数组。出于某种原因，这些键被复制得很好，但这些值永远不会起作用。我还可以在创建的块中完美地复制阵列。我无法将其从该块中复制出来。如果在块外声明

self.orgArray=[]

并在forEach循环中类似于

tempArray.push（doc.data（））

，该怎么办？

console.log（self.orgArray）

下面的

console.log（tempArray）

也可以工作吗？所有的console-log语句都可以正常工作。正如我在上一篇评论中提到的，我确实尝试直接推送到orgArray。结果是一样的。在创建的块中，我可以命名任何数组，并从一个数组复制到另一个数组。关键问题是将数组从创建的块内复制到数据函数内的数组。检查此线程：看看这是否有帮助？