My current challenge is getting my App to render on a new page instead of the same page. Despite trying render: h => h(App), it still renders on the same page.
This is the Vue file (Risks.vue) where the router will be linked:
<router-link to="/risk-info">
<td>{{item.Model}}</td>
<td>{{item.Vulnerability}}</td>
<td>{{item.Unresolved}}</td>
</router-link>
<router-view/>
The following code in index.js links the router to the Component:
import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)
const routes = [
{
path: '/risk-info',
name: 'RiskInfo',
component: () => import('../components/breakdown/risks/VulnerabilityDetails.vue')
}
]
const router = new VueRouter({
routes
})
export default router
And lastly, main.js is where the Vue object is defined:
new Vue({
router,
render: h => h(App),
store,
}).$mount('#app')