jsx - Stenciljs:找不到另一个组件

Question

我在 Stenciljs 中创建了一个新项目，但我在使用该项目中创建的组件时遇到问题。

import { Component, h, Prop } from '@stencil/core';

@Component({
    tag: 'fd-story',
    styleUrl: './story.css',
    shadow: true
})
export class Story {

    @Prop() name = '';

    render() {
        return (
            <div class="label">
                <span>{this.name}</span>
            </div>
        );
    }
}

我需要在另一个容器组件(Carousel)中使用这个组件，但是我遇到了以下问题:

作为此问题的解决方案，VSCode 告诉我可以导入该组件，但当我这样做时，出现以下错误:

TypeError: Class constructor Story cannot be invoked without 'new'

我在 Windows 10 上工作。有没有发生什么事？感谢您的评论。

Answer 1

我有一个初学者的错误。我没有以正确的方式调用组件:

 <Story
    visited={true}
    name='Comida 1'
    image='https://i.pinimg.com/originals/2a/45/af/2a45af7fa0c4347526f90ecc56e5764e.jpg'
 />

我应该这样调用它。

 <fd-story
    visited={true}
    name='Comida 1'
    image='https://i.pinimg.com/originals/2a/45/af/2a45af7fa0c4347526f90ecc56e5764e.jpg'
 />

我是在调用组件的类，但我需要调用标签名称(fd-story)。我希望有人服务它。