Closed
Description
Version
3.0.7
Reproduction link
https://github.com/sanjade/vue3-bug
Steps to reproduce
First of all, I know this kind of issue shouldn't be asked here but I just wanted to tell you that I did try asking the question in StackOverflow. However it has no response and it's been 2 days.
- git clone https://github.com/sanjade/vue3-bug
- cd vue3-bug && yarn
- Goto `App.tsx` and you will see the error in `type` attribute
What is expected?
Suppose I have this input component:
// components/input.tsx
import { defineComponent } from "@vue/runtime-core"
export default defineComponent({
inheritAttrs: false,
setup(props, { attrs }) {
return () => (
<div>
<input type="text" {...attrs} />
</div>
)
}
})
Now, I use this component like so and provide type="password" attribute:
// App.tsx
import { defineComponent } from "@vue/runtime-core"
import Input from "./components/input"
export default defineComponent({
setup(props, { attrs }) {
return () => <Input type="password"></Input>
}
})
I expect Typescript not to throw any error.
What is actually happening?
But Typescript complains in App.tsx:
(JSX attribute) type: string
Type '{ type: string; }' is not assignable to type 'IntrinsicAttributes & Partial<{}> & Omit<Readonly<{} & {}> & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>'.
Property 'type' does not exist on type 'IntrinsicAttributes & Partial<{}> & Omit<Readonly<{} & {}> & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>'.ts(2322)
How do you specify that InputHTMLAttributes are also allowed as props in the input.tsx component?
Metadata
Metadata
Assignees
Labels
No labels