Comment ignorer les propriétés profondément imbriquées dans l'API de composition de Vue pour une conversion réactive ?
P粉044526217
P粉044526217 2024-03-26 23:52:54
0
1
319

Dans vue-composition-api : En utilisant la méthode reactive(), je souhaite conserver une partie de l'objet comme référence.


J'ai quelques produits, appartenant à des catégories personnalisées :

const chair = new Product(...); // lots of information in each product 
const table = new Product(...); // lots of information in each product

et la liste de commande référençant les produits dans l'objet profond :

let example = reactive({   
  orders: [
    { product: chair, quantity: 2 }, 
    { product: table, quantity: 1 }, 
    { product: chair, quantity: 6 }, 
    { product: table, quantity: 2 },
  ] 
});

J'ai découvert grâce à example.orders[0].product == chair -> falseinspection qu'il s'agissait d'objets différents. J'ai aussi découvert que example.orders[0].product n'est pas de type Produit.

Comme je peux avoir de nombreuses commandes différentes et que les produits contiennent beaucoup de données, je souhaite example.orders[].product garder une référence au produit original.

Je n’ai pas besoin de réactivité dans les produits eux-mêmes car ils sont constants. (Il s'agit d'une application Electron, le contenu restera inchangé tant que le programme sera exécuté)

Je veux juste réagir à la commande.

P粉044526217
P粉044526217

répondre à tous(1)
P粉340264283

Utilisez markRaw :

import { markRaw, reactive } from 'vue';

const example = reactive({   
  orders: [
    { product: chair, quantity: 2 }, 
    { product: table, quantity: 1 }, 
    { product: chair, quantity: 6 }, 
    { product: table, quantity: 2 },
  ].map(el => ({ 
    ...el,
    product: markRaw(el.product)
  }))
});

REMARQUE : Veuillez lire les avertissements sur l'étiquette.

Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!