Question

我使用软件包"react-simple-tree-menu": "^1.1.4"（link to package）来制作树菜单。它工作正常，但不幸的是，它不能完全满足我的要求。

import React from 'react';
import TreeMenu, {ItemComponent} from 'react-simple-tree-menu'
import './ClientsTree.css'

export const ClientsTree = _ => (
    <TreeMenu data={treeData}>
        {({search, items}) => (
            <ul className={"tree-item-group"}>
                {items.map(props => {
                    return <ItemComponent {...{
                        ...props,
                        label: props.label + ' value: ' + props.value
                    }}/>
                })}
            </ul>
        )}
    </TreeMenu>
);

如您所见，它公开了 ItemComponent ，它对应于树菜单的一个节点。我对其进行了一些更改，使其充满了称为value的新值。但是它只是扩展了以前的标签。最后，我希望标签文本的格式在左侧，值在右侧。

class MyItemComponent extends ItemComponent {
    render() {
        return super.render()
    }
}

我决定从 ItemComponent 继承并创建 MyItemComponent ，然后更改外观。不幸的是，它不起作用，因为会引发错误：

TypeError：类构造函数必须用'new'调用

这是我的问题，如何适当地扩展此类，或者还有另一种方法可以按我需要的方式更改此ItemComponent。

如何在React中正确地扩展npm软件包中的组件

0 个答案: