Comment regarder prop changement dans Vue.js composant?

Je suis de passage d'un tableau d'image filepaths à un composant.
Je me demandais quel serait le meilleur moyen de regarder un changement dans la prop Vue.js composant, si je passe un tableau différent?

Je suis en utilisant bootstrap carrousel, si tu veux le réinitialiser à la première image lorsque la matrice de changements.
Dans l'ordre pour des raisons de simplicité j'ai réduit le code d'exemple à ceci:

Vue.component('my-images', {
  props: ['images'],

  template: `
    <section>
      <div v-for="(image, index) in images">
        {{index}} - <img :src="image"/>
      </div>
    </section>
  `
});
  • Vous pouvez watch un accessoire comme si il s'agissait d'un élément de données.
  • Un feedback est le bienvenu!
InformationsquelleAutor Tadas Majeris | 2017-03-24
  1. 15
    <template>
  <div>
    {{count}}</div>
</template>

<script>
export default {
  name: 'test',
  props: ['count'],
  watch: {
    '$props':{
      handler: function (val, oldVal) { 
        console.log('watch', val)
      },
      deep: true
    }
  },
  mounted() {
    console.log(this.count)
  }
}
</script>
    • pourriez-vous expain ce code un peu? j'.e pourquoi/comment ça marche?
    • Omg! Cette réponse vient d'être sauvegardé mes quelques dizaines de lignes de code. Je cherchais un componentWillReceiveProps mais pour Vue.js. J'ai dû regarder chaque propriété individuelle en Vue des observateurs. Mais maintenant, je peux les regarder tous dans la même fonction. 🙂 Merci beaucoup @binaryify
    InformationsquelleAutor Binaryify
  2. 2

    Vous êtes bon pour aller avec ceci:

    Vue.component('my-images', {
  props: ['images'],
  computed: {
    imagesComputed: function () {
      //just an example of processing `images` props
      return this.images.filter((each, index) => index > 0);
    }
  },
  template: `
    <section>
      <div v-for="(image, index) in imagesComputed">
        {{index}} - <img :src="image"/>
      </div>
    </section>
  `
});
    InformationsquelleAutor Jonatas Walker