JavaScript - Le transfert de données entre la vue et les composants échoue
phpcn_u1582
phpcn_u1582 2017-05-19 10:46:04
0
3
668

Event Bus est utilisé pour le transfert de données entre les deux composants, mais il y a un problème lors de l'affectation des données.

Composants acceptant les données :

<template>
  <p>
     <h1>{{movie.name}}</h1>
  </p>
</template>

<script>
  import Bus from '../bus.js'
  export default {
    name: 'MovieDetail',
    data: function () {
      return {
        movie: {},
        index: 110
      }
    },
    methods: {
      downloadPic () {
        console.log('name=' + this.movieName + ', name2=' + this.movie.name)
      }
    },
    created () {
      Bus.$on('loadMovie', (index, movie) => {
        console.log('index=' + this.index + ', movie=' + this.movie)
        this.setMovie(movie)
        this.setIndex(index)
        console.log('movie name=' + this.movie.name)
      })
    },
    computed: {
      movieName: function () {
        if (this.movie) {
          return this.movie.name
        }
      }
    }
  }
</script>

Dans la console et le journal, nous pouvons voir que la fonction créée a été appelée et que this.movie a été réaffecté, mais l'interface utilisateur de l'interface n'a pas changé et le this.movie actuel imprimé est toujours un objet vide. ce?

phpcn_u1582
phpcn_u1582

répondre à tous(3)
小葫芦

Répondez-y vous-même, principalement parce que je ne comprends pas le mécanisme de Bus. Lorsque ce composant a créé un rappel, l'émission d'un autre composant avait déjà été envoyée, ce qui a empêché la réception de l'événement.

習慣沉默

Lors de l'attribution de valeurs à des objets dans Vue, si ses attributs ne sont pas déclarés dans les données, l'affectation dynamique peut ne pas fonctionner. Vous pouvez essayer d'ajouter un attribut de nom et cela devrait aller. Vous pouvez consulter les instructions officielles de vue https://vuefe.cn/v2/guide/rea... La première étape pour avancer——problème de détection de changement

En raison des limitations du Javascript moderne (et de la dépréciation d'Object.observe), Vue ne peut pas détecter l'ajout ou la suppression de propriétés d'objet. Étant donné que Vue effectue le processus de conversion getter/setter sur la propriété lors de l'initialisation de l'instance, la propriété doit exister sur l'objet de données pour que Vue la convertisse afin qu'elle soit réactive.

仅有的幸福

Publier tous les codes ?

this.setMovie(movie)
this.setIndex(index)

Je ne sais pas ce que ces deux-là ont fait.

Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal