[Vuejs]-Vue JS: Pass props inside component of component

by

3👍

✅

You can’t access parent component’s props directly from child component; You need to declare the prop in the child component, and then pass data to it from parent component.

export default {
  props: ['dataset'],
  components:{
    'line-chart': {
      extends: Bar,
      props: ['dataset'],                // declare the prop
      beforeMount () {
        try {
          this.addPlugin(horizonalLinePlugin)
          console.log(this.dataset);     // access with this.dataset
        } catch(err) {
        }
      },
      mounted () {
        this.renderChart(chartOption, chartSettings)
      }
    }
  }

And then in your template, pass the dataset from parent component to child component:

<line-chart :dataset="dataset"></line-chart>
👤Psidom

Leave a comment