我想定义我的自定义组件,并指定哪种“标准组件”,我会扩展。
这将为扩展组件的所有标准属性使用VSCode智能感知,而无需重新定义所有属性。
这就是我要做的:
<script lang="ts">
// Error: Cannot redeclare block-scoped variable '$$props'
export let $$props: svelte.JSX.HTMLAttributes<HTMLButtonElement>;
// OR
// Error: Cannot redeclare block-scoped variable '$$restProps'
export let $$restProps: svelte.JSX.HTMLAttributes<HTMLButtonElement>;
export let myCustomProp: string;
</script>
<button {...$$restProps}>{myCustomProp}<slot /></button>
为了更好地解释我想做什么,我在React with Typescript中发布了相同的案例
import React from 'react';
type Props = {
myCustomProp: string;
} & React.ButtonHTMLAttributes<HTMLButtonElement>;
export default function ({ myCustomProp, ...rest }: Props) {
return (
<button {...rest}>
{myCustomProp}
{rest.children}
</button>
);
}
1条答案
按热度按时间czfnxgou1#
使用
svelte/elements
提供一个interface $$Props
,它扩展了您要键入的特定HTML元素。Button.svelte
:+page.svelte
: