Vue version
3.3.4
Link to minimal reproduction
https://gitee.com/xxx8848/vue-definecomponent-demo
Steps to reproduce
- clone repo
- open project in vscode with Volar v1.8.8 and Volar TS v1.8.8
- go to
app.vue and todo-list/index.tsx
- search lines marked with
ERROR:, or hover the error underscores by TS
What is expected?
defineComponent with Function Signature can work properly
- use all component prop: ref, class, style ...
- use
SetupContext when using generic setup: emit, expose ...
What is actually happening?
<TodoList1> use defineComponent Function Signature. But can't use ref in this component.
<!-- ERROR: ref does not exist in TodoProps type -->
<TodoList1 v-model="data1" ref="ref1"/>
and using generic in defineComponent, SetupContext can't infer in setup's second parameter
export const TodoList3 = defineComponent(
<Data extends string|number>(
props: {modelValue:Data[]},
{ emit } // ERROR: Binding element 'emit' implicitly has an 'any' type.ts(7031)
) => {
System Info
System:
OS: macOS 13.4.1
CPU: (12) x64 AMD Ryzen 5 5600U with Radeon Graphics
Memory: 855.64 MB / 16.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 16.20.1 - /usr/local/opt/node@16/bin/node
npm: 8.19.4 - /usr/local/opt/node@16/bin/npm
pnpm: 8.6.7 - /usr/local/bin/pnpm
Browsers:
Chrome: 115.0.5790.114
Safari: 16.5.1
Any additional comments?
digging into vue's type definition, i find the defineComponent for use setup directly and generic
apiDefineComponent.ts #Line98
overload 1: direct setup function
and its return type is
(props: Props & EmitsToProps<E>) => any
only infer Props and parsed Emits defined by user, doesn't append compnent's props to it, like
export type PublicProps = VNodeProps &
AllowedComponentProps &
ComponentCustomProps
it's designed that user can't use these prop in this function signature?
Vue version
3.3.4
Link to minimal reproduction
https://gitee.com/xxx8848/vue-definecomponent-demo
Steps to reproduce
app.vueandtodo-list/index.tsxERROR:, or hover the error underscores by TSWhat is expected?
defineComponentwith Function Signature can work properlySetupContextwhen using generic setup: emit, expose ...What is actually happening?
<TodoList1>usedefineComponentFunction Signature. But can't userefin this component.and using generic in
defineComponent,SetupContextcan't infer in setup's second parameterSystem Info
System: OS: macOS 13.4.1 CPU: (12) x64 AMD Ryzen 5 5600U with Radeon Graphics Memory: 855.64 MB / 16.00 GB Shell: 5.9 - /bin/zsh Binaries: Node: 16.20.1 - /usr/local/opt/node@16/bin/node npm: 8.19.4 - /usr/local/opt/node@16/bin/npm pnpm: 8.6.7 - /usr/local/bin/pnpm Browsers: Chrome: 115.0.5790.114 Safari: 16.5.1Any additional comments?
digging into vue's type definition, i find the
defineComponentfor use setup directly and genericand its return type is
only infer
Propsand parsedEmitsdefined by user, doesn't append compnent's props to it, likeit's designed that user can't use these prop in this function signature?