1

In this ticket, we can pass parameters to component when the route changes via 

<router-view class="view" :propForA="AData"></router-view>

My question is If we need pass different props to different routed component, say, for example, propForB property will have BData , propForC property will have CData

how to achieve that? Especially in vuejs2.0?

Bert
  • 80,741
  • 17
  • 199
  • 164
kidsit
  • 287
  • 3
  • 22

1 Answers1

1

I would send one prop with different values that fits your component... For example:

<router-view class="view" :propData="propToSend"></router-view>

then something like this

export default {

  data: function () {
    return {
      propAData: {
        something: 'value',
        somethingElese: ['other', 'value']
      },
      propBData: {
        somethingOther: 123
      },
      propToSend: null
    }
  },

  watch: {
    '$route': function (val, oldVal) {
      if (this.$route.name === 'Something') {
        this.propToSend = this.propAData
      } else {
        this.propToSend = this.propBData
      }
    }
  }
}

There are of-course other ways, to achieve same result...

Primoz Rome
  • 10,379
  • 17
  • 76
  • 108
  • this solution works to some extend, but does not fit exactly what i want. This add a wrapper to property, i must change every component's defination object to retrieve props via propAData.something and propAData.somethingElse. I like it to introduce no change for the tons of legacy components. Just now, i workaround it to give all the props data in the router-view defination, this looks ugly, but it works. – kidsit Sep 16 '16 at 07:14