vuejs / composition-api

Composition API plugin for Vue 2

Home Page:https://composition-api.vuejs.org/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

the file shim-tsx.d.ts makes the refs disabled

danielhuoo opened this issue · comments

I added the file: shim-tsx.d.ts as the README saids.

// file: shim-tsx.d.ts
import Vue, { VNode } from 'vue';
import { ComponentRenderProxy } from '@vue/composition-api';

declare global {
  namespace JSX {
    interface Element extends VNode {}
    interface ElementClass extends ComponentRenderProxy {}
    interface ElementAttributesProperty {
      $props: any; // specify the property name to use
    }
    interface IntrinsicElements {
      [elem: string]: any;
    }
  }
}

And then, I also have a tsx file written by:

import { defineComponent, ref } from "@vue/composition-api";
import Dialog from "./Dialog";

export default defineComponent({
	name: "A Tsx file",
	setup(prop) {
		const DialogRef = ref(null);
		return { DialogRef };
	},
	render() {
		return <Dialog ref="DialogRef" />;
	},
});

However, there is a TS error:
image

If I revert the file shim-tsx.d.ts to the original version, then the error is gone.

import Vue, { VNode } from 'vue';

declare global {
  namespace JSX {
    // tslint:disable no-empty-interface
    interface Element extends VNode {}
    // tslint:disable no-empty-interface
    interface ElementClass extends Vue {}
    interface IntrinsicElements {
      [elem: string]: any;
    }
  }
}

Could anyone explain this problem? Thanks very much~

Stale issue message

can you provide me a reproducible demo?

Stale issue message