Comment définissez-vous les valeurs de données dans un composant avec Vue-Test-Utils avant d'appeler monté?

Question

J'utilise Jest avec Vue-Test-Utils. Le code que j'utilise ressemble à ceci:

beforeEach(() => {
  wrapper = shallow(GridContainer, {
    data: {
      pageSize: count
    },
    propsData: {
      userId,
      managerId
    }
  })
})

Dans cet exemple, je souhaite définir la valeur de pageSize avant l'appel du cycle de vie monté. Le problème avec le code ci-dessus est que j'ai commencé à recevoir l'avertissement suivant lors de l'exécution des tests:

[Vue warn]: Do not use built-in or reserved HTML elements as component id: data

Lorsque je supprime la propriété de données ci-dessus, l'avertissement disparaît.

Suis-je en train de définir correctement les données? Si oui, que dois-je faire à propos de l'avertissement?

Dois-je définir les données d'une autre manière?

Answer 1

Veuillez essayer comme ceci:

beforeEach(() => {
  wrapper = shallow(GridContainer, {
    propsData: {
     userId,
     managerId
    }
  })
 wrapper.setData({pageSize: count})
})

référence: setData https://vue-test-utils.vuejs.org/en/api/wrapper/setData.html