For a project I've been working on, I'm considering incorporating vuejs for some of the UI elements. I followed a tutorial and put together a simple example to get started.
Here is a basic javascript object I have:
var hex = {};
hex.turn_phase = 'unit_placement';
In my template, I set up:
var app = new Vue({
el: '#vue-test',
data: {
message: 'Hello Vue!',
turn_phase: hex.turn_phase,
},
delimiters: ["<%","%>"],
mounted: function() {
this.fetch_turn_phase();
},
methods: {
fetch_turn_phase: function() {
Vue.set(this, 'turn_phase', hex.turn_phase);
},
}
});
Initially, this correctly displays the turn_phase on the template. However, if I update the hex.turn_phase value in the browser console, the template does not update.
Am I overlooking something in this basic example?