main.js：

import Vue from 'vue'
import App from './app.vue'

let vm = new Vue({
    el: '.layers-container',
    render: h => h(App),
})

//This doesn't work, layers undefined
console.log(vm.layers);

//This doesn't work either
vm.layers.push({'name': 'image2'})

app.vue使用vue-loader：

<template>
<div>
    <div v-for="item in layers>
        <a :href="item.name"></a>
    </div>
</div>
</template>

<script>
export default {
  name: 'app',
  data() {
    return {
      layers: [{'name': 'image1'}]
    }
  }
}
</script>

我有一个画布中的对象被视为我想要添加到此列表的图层，所以我试图获取Vue的实例并将对象推送到它上面，然后它更新模板中的数据 . 但是，我似乎无法在组件本身之外实际执行此操作，而且我不知道我是否只是做错了，或者我是否真的必须将其余的代码放入组件中 .

如何将上面的示例数据推送到app.vue中的layers数组？

javascript vue.js