Progress Bar Using Vue Router with Children Elements

I am using laravel, vue and vue-material to develop an SPA and want to have a "determinate spinner" while the content on the page loads. I currently have the dashboard as a parent component. How do I get the progress of the child component as it loads? and pass it to "progress" to control the determinate spinner?

//vue-material element

//from routes file let routes = [ { path: '/', component: require('./views/Dashboard.vue'), children: [ { path: '', component: require('./views/Home.vue') }, { path: 'create-lead', component: require('./views/Login.vue') }, ] },

I am using the latest versions of vue and vue-router with laravel 5.4.

Thanks!

via Chebli Mohamed