Im kombinierten API-Unit-Test von Vue 3 wurde festgestellt, dass $route nicht im onMounted()-Hook definiert war
<p>Ich habe einen <code>onMounted()</code>-Hook in der <code>setup()</code>-Funktion, der auf <code>$route> zugreift ;-Attribut, aber wenn ich das <code>$route</code>-Objekt verspotte, ist der <code>$route</ im Hook-Code <code> <code>undefiniert</code>, daher wird ein Fehler ausgegeben. Hier ist der Code: </p>
<p><strong>Component.vue:</strong></p>
<pre class="brush:php;toolbar:false;"><template>
<div>{{ this.$route.params.id }}</div>
</template>
<script lang="ts">
importiere {defineComponent, onMounted} aus 'vue'
{useRoute} aus „vue-router“ importieren;
Standard exportieren defineComponent({
Name: 'Komponente',
aufstellen() {
const route = useRoute()
onMounted(() => {
console.log(route.params.id)
})
zurückkehren {}
}
})
</script></pre>
<p><strong>component.spec.ts:</strong></p>
<pre class="brush:php;toolbar:false;">import {mount} from "@vue/test-utils";
Komponente aus „@/views/Bundle/Component.vue“ importieren;
test('testbeschreibung', async () => {
const mockRoute = {
Parameter: {
ID: 1
}
}
const mockRouter = {
push: jest.fn()
}
const wrapper = mount(Komponente, {
global: {
spottet: {
$route: mockRoute,
$router: mockRouter
}
}
})
Warten Sie auf wrapper.find('button').trigger('click')
})</pre>
<p><strong>Wirft einen Fehler aus: </strong> TypeError: Eigenschaft „params“ von undefiniert kann nicht gelesen werden</p>
<p>Ich verwende vue-test-utils Version 2.0.0-rc.12. </p>
<p>Jede Hilfe wäre sehr dankbar</p>