Как я могу определить испускание с типом возврата, отличным от void в Vue 3.3+? (Машинопись)
Начиная с Vue 3.3 можно определить выбросы в TypeScript следующим образом:
<script setup lang = "ts">
const emit = defineEmits<{
change: [id: number]
update: [value: string]
}>()
</script>
Как я могу это сделать, если мне нужен тип возвращаемого значения, отличный от void, например String?
@kissu та же ссылка, которую я видел, она не отвечает на мой вопрос.
это бесполезно, из испускаемых значений нет возвращаемого значения
@AlexanderNenachev, если это правильный ответ, не стесняйтесь отвечать на этот вопрос. Просто расширьте это немного больше, спасибо.
Ответы 1
К сожалению, в ядре шаблон эмиттера событий не возвращает никакого возвращаемого значения.
Но учитывая, что все обработчики событий связаны со свойствами onXXX, вы можете ввести значения, возвращаемые событием. Хотя здесь не используется механизм emit и из-за этого могут быть некоторые недостатки, о которых я не знаю в контексте вашего варианта использования.
Также обратите внимание, что мы теряем ввод атрибутов App.vue из-за резервных атрибутов.
Смотрите на Vue SFC Playground
<script setup lang = "ts">
import Wrapper from './Wrapper.vue';
</script>
<template>
<wrapper @event = "() => 'app handled'"/>
</template>
Обертка.vue
<script setup lang = "ts">
import Comp from './Comp.vue';
</script>
<template>
<comp @event = "() => 'wrapper handled'"/>
</template>
Комп.vue:
<script setup lang = "ts">
const props = defineProps<{
onEvent: (() => string) | Array<() => string>,
}>();
function onClick(){
const handlers = Array.isArray(props.onEvent) ? props.onEvent : [props.onEvent];
for(const fn of handlers){
alert(fn());
}
}
</script>
<template>
<button @click = "onClick">Click</button>
</template>
Разве не так? vuejs.org/api/…