Vue 旧阵列镜像新阵列

Question

我的数据中声明了两个数组

data() {
        return {
            infeed_data:[],
            infeed_model:[],
        }
    },

一旦页面被挂载，下面的方法就开始了

mounted() {
        this.get_rolls_infeed()

    },

此方法调用我的 api，然后将响应分配给 infeed_data 和 infeed_model。然后我执行一个 for 循环并在 infeed_model 上创建新的键/值，但是新的键/值显示在 infeed_data 中。

get_rolls_infeed(){
            var vthis = this;
            axios.post(myapiurl)
            .then(function(response){

                vthis.infeed_data = response.data[0]
                vthis.infeed_model = response.data[0]

                vthis.infeed_model.forEach(function(record, index){
                   vthis.infeed_model[index].usage_type = 0
                })

            })
        },

我的 Vue html

<b>Infeed Data</b>
<p>{{infeed_data}}</p>

<br />

<b>Infeed Model</p>
<p>{{infeed_model}}</p>

渲染 html 以显示 _data 如何镜像 _model

Answer 1

你可以尝试这样做而不是你的代码吗？

vthis.infeed_data = response.data[0];
vthis.infeed_model = response.data[0].slice();