스벳 유형 스크립트의 스벳 사용자 정의 이벤트

스벳 유형 스크립트의 스벳 사용자 정의 이벤트

클릭을 사용합니다.내 svelte-type 스크립트 프로젝트에 대한 외부 지침이며 관련 요소에 사용자 지정 이벤트를 할당할 때 이 오류가 발생합니다.

Type '{ class: string; onclick_outside: () => boolean; }' is not assignable to type 'HTMLProps<HTMLDivElement>'.
  Property 'onclick_outside' does not exist on type 'HTMLProps<HTMLDivElement>'

여기 제 코드의 일부가 있습니다.

{#if profileToolbar}
<div
    transition:fly={{ y: -20, duration: 300 }}
    use:clickOutside={profileToolbarContainer}
    on:click_outside={() => (profileToolbar = !profileToolbar)}
    class="origin-top-right absolute right-0 mt-2 w-48 rounded-md
    shadow-lg z-10 shadow-md">

이것이 클릭입니다.현재 사용하고 있는 외부 지시어 https://svelte.dev/dev/0ace7a508bd843b798ae599940a91783?version=3.16.7

저는 타자기에 익숙하지 않아서 구글 검색을 어디서부터 시작해야 할지 잘 모르겠습니다. 이 문제를 해결하는 방법을 아는 사람이 있나요?도와주셔서 고마워요.

문서에 따르면 다음을 만들 수 있습니다..d.ts파일을 프로젝트 어딘가에 저장합니다.그리고 그 파일 안에 다음을 넣습니다.

declare namespace svelte.JSX {
  interface HTMLAttributes<T> {
    onclick_outside: () => void
  }
}

자세한 내용은 설명서를 참조하십시오.

이 선언은 나에게 효과가 있었습니다.

declare namespace svelte.JSX {
  interface DOMAttributes<T> {
    onclick_outside?: CompositionEventHandler<T>;
  }
}

다음에서 사용자 지정 유형 선언의 위치를 지정하는 것을 잊지 마십시오.tsconfig.json

좋아요, 그래서 기존의 답변들은 저에게 부분적으로만 효과가 있었습니다.그것을 고려할 때.clickOutside작업은 이름이 지정된 사용자 지정 이벤트를 실행합니다.click_outside저는 다음과 같은 해결책에 도달합니다.

declare namespace svelte.JSX {
    interface HTMLProps<T> {
        onclick_outside?: (e: CustomEvent) => void;
    }
}

저에게 다음과 같은 것이 효과가 있었습니다.

declare namespace svelteHTML {
    interface HTMLAttributes<T> {
        "on:click_outside"?: CompositionEventHandler<T>;
    }
}

마음속에src/app.d.ts.

이것을 근거로 하여

여기 내꺼src/app.d.ts파일.

// See https://kit.svelte.dev/docs/types#app
// for information about these interfaces
declare global {
    namespace App {
        // interface Error {}
        // interface Locals {}
        // interface PageData {}
        // interface Platform {}
    }

    namespace svelte.JSX {
        interface HTMLAttributes {
            onclick_outside: () => void
        }
    }
}

export { };

J

언급URL : https://stackoverflow.com/questions/64131176/svelte-custom-event-on-svelte-typescript