dashboard.f7.html
// inside mounted hook
var self = this;
console.log(self.$root.VehicleAvailable); // shows undefined
console.log(self.$root.VehiclesInYard); // shows undefined
console.log(self.$root.VehiclesInPlant); // shows undefined
console.log(self.$root.VehicleOnTrip); // shows undefined
app.js
// ...
// root data
data: function () {
return {
VehicleAvailable: 0,
VehiclesInYard: 0,
VehiclesInPlant: 0,
VehicleOnTrip: 0,
};
},
// ...
dashboard.f7.html
<div class="card-footer" style="background: #fec825; color: #ffffff; font-weight: 700">
{{@root.VehicleAvailable}}
<!-- do not update the html here-->
</div>
dashboard.f7.html
- Inside
mounted
hook there is anajax
call to updateroot
self.$root.VehicleAvailable = res.data[0].VehicleAvailable;
- do not updates
html