[Vuejs]-Vue.js 2.0 bootstrap app.vue

0๐Ÿ‘

โœ…

If you are trying to access data of root component: authenticated in the child component: Navigation, it is not possible directly.

You can pass it as props to the Navigation, which is a standard practive to send data to child components in vue.

You have to make following changes for this. add a option props in Navigation vue, like following:

Vue.component('navigation', {
  // declare the props
  props: ['authenticated'],
  // just like data, the prop can be used inside templates
  // and is also made available in the vm as this.message
  template: '<span>{{ authenticated }}</span>'
})

pass the authenticated from the root component from App.vue, like following:

<template>
    <div class="container">
        <navigation :authenticated="authenticated"></navigation>
        <main>
        ....
        ....
๐Ÿ‘คSaurabh

Leave a comment