Wie verwende ich wiederverwendbaren Code aus einer anderen Datei in der Kompositions-API von Vue 3?
P粉323050780
P粉323050780 2023-08-26 13:01:48
0
1
532
<p>Ich habe wiederverwendbaren Code in dateTime.js erstellt: </p> <pre class="brush:php;toolbar:false;">import { ref, computed, watch } from 'vue'; * als Dayjs aus 'Dayjs' importieren; Standardfunktion dateTime() exportieren { const newDateTimeString = ref(null); Funktion showDateTime(data) { const dateTime = dayjs(data).format('TT-MM-JJJJ') newDateTimeString.value = dateTime; } zurückkehren { newDateTimeString, showDateTime } }</pre> <p><strong>Der Code in dateTime.js wird in Table.vue aufgerufen: </strong></p> <p>Frage: Wie sorge ich dafür, dass es funktioniert? Ich möchte <code>{{ showDateTime(scope.row[itemIn.field]) }}</code> verwenden. Es scheint mir, dass dies letztendlich die Funktion <code>showDateTime</code> in <code>dateTime.js</code> auslösen sollte. </p> <p>Was habe ich falsch gemacht? Fehlercode: <code>Uncaught (in versprochen) TypeError: Object(...) ist keine Funktion</code>, die sich auf <code>const { showDateTime } = useDateTime();</code> ; </p> <pre class="brush:php;toolbar:false;"><template v-else-if="itemIn.type == 'dateTime'"> {{ showDateTime(scope.row[itemIn.field]) }} </template> <script> import { ref, berechnet } aus 'vue'; import { defineComponent } from „vue“; import { useStore } aus „vuex“; import { useDateTime } from '@/composables/dateTime'; Standard exportieren defineComponent({ Name: "", Requisiten: { processingData: Objekt }, Komponenten: { Flagge }, gibt aus: ["unique", "refresh"], setup(props, {emit}) { const { showDateTime } = useDateTime(); const store = useStore() Funktion setStatus(id, route) { const-Objekt = { Ich tat, Route: Route } return store.getters.getStatus(object); } zurückkehren { getScope, setUniqueId, getClass, getWidth, navigierenPaginierung, setStatus, setTag, showDateTime }; } }); </script></pre> <p><br /></p>
P粉323050780
P粉323050780

Antworte allen(1)
P粉964682904

当你使用export default导出useDateTime hook时,你必须在导入时不使用{ }

import useDateTime from '@/composables/dateTime';
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage