跟着tiptap文档写的,在编写addNodeView
函数的时候类型检查报错了
src/editor/index.ts:62:32 - error TS2345: Argument of type 'DefineComponent<ExtractPropTypes<{ editor: { type: PropType<Editor>; required: true; }; node: { type: PropType<Node>; required: true; }; decorations: { type: PropType<readonly DecorationWithType[]>; required: true; }; ... 4 more ...; deleteNode: { ...; }; }>, ... 18 more ..., any>' is not assignable to parameter of type 'Component<NodeViewProps>'.
Type 'DefineComponent<ExtractPropTypes<{ editor: { type: PropType<Editor>; required: true; }; node: { type: PropType<Node>; required: true; }; decorations: { type: PropType<readonly DecorationWithType[]>; required: true; }; ... 4 more ...; deleteNode: { ...; }; }>, ... 18 more ..., any>' is not assignable to type 'ComponentPublicInstanceConstructor<NodeViewProps, any, any, any, ComputedOptions, MethodOptions>'.s, HTMLAttributes
62 return VueNodeViewRenderer(Component);
~~~~~~~~~
src/editor/index.ts:62:32
62 return VueNodeViewRenderer(Component);
~~~~~~~~~
Did you mean to use 'new' with this expression?
部分代码:
import {
Node,
VueNodeViewRenderer,
mergeAttributes,
Editor,
ToolboxItem,
} from "@halo-dev/richtext-editor";
import Component from "./Component.vue";
...
parseHTML() {
return [
{
tag: "vue-component",
},
];
},
renderHTML({ HTMLAttributes }) {
return ["vue-component", mergeAttributes(HTMLAttributes)];
},
addNodeView() {
return VueNodeViewRenderer(Component); // 在这里报错了
},
Component.vue
的代码
<script lang="ts" setup>
import { nodeViewProps, NodeViewWrapper } from "@halo-dev/richtext-editor";
const props = defineProps(nodeViewProps);
</script>
<template>
<NodeViewWrapper> Vue component </NodeViewWrapper>
</template>
<style lang="scss" scoped></style>