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 using 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>
I have objects from a canvas that are treated as layers I want to add to this list, so I'm trying to take the instance of Vue and push objects onto it so it then updates the data in the template. But, it seems that I can't actually do that outside of the component itself, and I don't know if I'm just doing it wrong, or if I really have to put the rest of my code into the components.
How would I push the data as exampled above, to the layers array in app.vue?