Le saut de page Vue n'enregistre pas la valeur

1. Description du problème

Dans Vue.js, lors de l'utilisation de $route.params pour obtenir les paramètres de saut, la page ne peut pas obtenir les valeurs des paramètres après le saut et les paramètres sont perdus.

2. Analyse du problème

1. Il se peut qu'il y ait un problème avec la configuration du routage, empêchant la reconnaissance des paramètres de saut.

2. Il se peut que le code de la page de saut ne gère pas correctement les paramètres de saut, ce qui entraîne que la valeur du paramètre ne soit pas rendue.

3. Résolution des problèmes

1. Vérifiez la configuration du routage pour vous assurer que les paramètres sont correctement définis.

2. Dans le hook de cycle de vie créé ou monté de la page de saut, utilisez $route.params pour obtenir les paramètres, attribuez la valeur du paramètre à la variable et utilisez la variable dans le modèle pour afficher la page.

4. Exemple de code

1. Configuration du routage :

{
  path: '/product/:id',
  name: 'product',
  component: Product
}

2. Code du composant du produit :

<template>
  <div>
    <h2>{{ product.name }}</h2>
    <p>{{ product.description }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      product: {},
    };
  },
  created() {
    this.getProduct(this.$route.params.id);
  },
  methods: {
    getProduct(id) {
      // 发送请求获取产品信息
      axios.get(`/api/products/${id}`).then((response) => {
        this.product = response.data;
      });
    },
  },
};
</script>

Après avoir configuré de cette manière, vous pouvez obtenir les informations sur le produit avec l'ID 123 en visitant /product/123 et les afficher sur la page.

Pour résumer, le problème des paramètres manquants dans le saut de page Vue.js peut être causé par des problèmes de configuration de routage ou de code de page. Vous devez vérifier la configuration de routage et le code de page pour vous assurer que les paramètres peuvent être obtenus correctement et le code de la page. la page peut être rendue.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!