Question

所以我正在使用一个名为Evergreen的React UI库，该库未键入。

我正在为正在使用的组件写一个声明，当我碰到一点障碍时，菜单在React中的结构如下：

<Menu>
    <Menu.Group>
        <Menu.Item>Share...</Menu.Item>
        <Menu.Item>Move...</Menu.Item>
        <Menu.Item>Rename...</Menu.Item>
    </Menu.Group>
    <Menu.Divider />
    <Menu.Group>
        <Menu.Item intent="danger">Delete...</Menu.Item>
    </Menu.Group>
</Menu>

但是Menu.Group，Menu.Item和Menu,Divider抛出错误，提示Property 'Divider' does not exist on type 'typeof Menu'

当前菜单的声明如下：

export interface IMenuProps extends ICSSProps {
    is?: any;
    onSelect?: any;
    icon?: any;
    children?: any;
    secondaryText?: any;
    appearance?: string;
    intent?: any;
    theme?: any;    
}
export class Menu extends React.PureComponent<IMenuProps> {}

我对TS还是很陌生，所以完全不知道如何声明它们，我已经尝试在IMenuProps中添加类似Divider: () => void;的内容，并且我已经尝试在菜单中添加public Divider: any;上课，但没有运气（我并不感到惊讶）！

如果有人能指出正确的方向，我将非常感激！

谢谢！

Answer 1

想通了！点表示法组件需要在类内部定义为无状态功能组件，并通过该接口传递接口！这是一个片段，以防有人需要。

export class Menu extends React.PureComponent<IMenuProps> {

        public static Group: React.SFC<IMenuGroup>;
        public static Divider: React.SFC<IMenuDivider>;
        public static Item: React.SFC<IMenuItem>;

    }

    export interface IMenuGroup extends ICSSProps {
        title: string;
        group: string;
    }

    export interface IMenuDivider extends ICSSProps {
        title: string;
        divider: string;
    }

    export interface IMenuItem extends ICSSProps {
        title: string;
        item: string;
    }
}

声明第三方库的已定义属性

1 个答案: