我想在 Typescript 中創建一個與 HTML<select>元素具有所有相同屬性的 React 組件。
我將如何輸入這個？
type Props = {
label: string
} & HTMLSelectElementAttributes; // This one is wrong
function MySelect(props: Props) {
return <label>{props.label}</label><select {...props}>
<option value="A">A</option>
<option value="B">B</option>
</select>;
}
uj5u.com熱心網友回復：
在像 VSCode 這樣的型別感知 IDE 中，如果將滑鼠懸停在 上<select，您將看到：
React.DetailedHTMLProps<React.SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>
您可以將其用作其他道具的型別。
type Props = {
label: string;
} & React.DetailedHTMLProps<React.SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>; // This one is wrong
const MySelect = (props: Props) => (
<div>
{' '}
<label>
label
{props.label}
</label>
<select {...props} />
</div>
);
// Example usage in which no type warnings result
const X = () => <MySelect label="foo" onChange={() => { console.log('change'); }} />;
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/452202.html
下一篇：w3c檔案xpath不回傳節點集