route.params n'est pas défini lors du transfert de données entre composants via route.push

Question

Je souhaite transmettre les données de Homepage.vue à clickthru.vue. En cliquant sur un enregistrement dans la table (dans Homepage.vue), je souhaite accéder à un nouveau composant (clickthru.vue). Le but est de transmettre deux données de deux manières différentes : Premièrement : je souhaite transmettre le cve_id en tant que route.query comme ceci /clickthru?cve_id=CVE-xxxx-xxxx Deuxièmement : je souhaite également transmettre un objet en tant que paramètre à Rendered. /installé sur clickthru.vu

P粉547170972 · Answer

Comme je l'ai mentionné dans les commentaires, transmettre des objets en tant que paramètres de requête n'est pas une méthode populaire, il existe donc deux façons de le faire -

Méthode 1-
Seulement cve_id 传递给新路由，并在安装新路由的页面时，使用此查询参数 cve_id 从后端获取 cve_object. Cette approche est utile et recommandée car vous obtenez toujours des données mises à jour du backend.

Si vous suivez cette approche, quelques changements doivent être apportés -

Passez simplement cve_id à votre nouvel itinéraire dans Homepage.vue -

methods: {
    onAboutClick(cve_id) {
        this.$router.push({
            name: "clickthru",
            query: { cve_id: cve_id },
        });
    },
},

au clickthru.vue 安装的挂钩上，初始化 API 调用以获取该 id 的 cve_data-

mounted() {
 // Make an API call to fetch the respected id's data
}

Méthode 2-
Lorsque vous recevez un enregistrement (celui en boucle) dans HomePage.vue, enregistrez ces données dans votre Statut VuexHomePage.vue 中收到记录（正在循环的记录）时，请将此数据保存到您的 Vuex 状态。现在，与方法一相同，仅将 cve_id. Maintenant, comme pour la première méthode, transmettez simplement à la nouvelle route et récupérez-la à partir de l'état Vuex

au lieu d'un appel API supplémentaire lorsque la page de la nouvelle route est installée.

Si vous suivez cette méthode, le processus sera comme ceci-

const store = new Vuex.Store({
  state: {
    records: []
  },
  mutations: {
    SET_RECORDS (state, backend_response) {
      // mutate state
      state.records = backend_response;
    }
  }
})

cve_id，因此可以使用它从状态获取相关的 cve_object。因此，在安装了 clickthru.vue Comme pour la première méthode, vous avez

cve_object

clickthru.vue

cve_idDe cette façon, vos enregistrements seront dans cet état afin que vous puissiez utiliser la requête

sur n'importe quelle page pour trouver n'importe quel enregistrement.

Attention-
Je donne seulement l'idée d'obtenir et de définir des données de l'état. Si vous souhaitez adopter la deuxième approche, lisez simplement Vuex et suivez la documentation. Vous pouvez également consulter le guide complet ici Comment configurer Vuex dans une application Vue

. 🎜

route.params n'est pas défini lors du transfert de données entre composants via route.push

répondre à tous(1)je répondrai