将自定义样式添加到 react-sortable-tree

Question

我正在使用带有 typescript 和 react-sortable-tree-theme-minimal 的 react-sortable-tree 库，我得到了这个结果

我需要像这样在箭头和标题之间做一个小的space

查看Tokyo and Jászárokszállás之间的防守我添加 .less 带有样式代码的文件

.rstcustom__rowTitle {
    margin-left: 1% !important;
    font-weight: lighter !important;
    color: red !important;
}

并将其导入我的组件import '../view/LayoutDepartmentSettings/Style.less';

并将其与树一起使用

                <SortableTree
                    rowHeight={50}
                    treeData={this.state.treeData}
                    onChange={this.updateTreeData}
                    canDrag={false}
                    className={"rstcustom__rowTitle"}
.......

但样式没有改变，树也没有受到影响。请告诉我我的错误在哪里

Answer 1

在您的组件中添加样式，这将对您有所帮助。

<SortableTree
 rowHeight={50}
 treeData={this.state.treeData}
 onChange={this.updateTreeData}
 canDrag={false}
 className={"tree"}
 style={{marginLeft:3,fontWeight:"lighter",color:"red"}}
                     
/>```

Answer 2

感谢您的帮助，我通过将 css loader 添加到 webpack.config 文件

来解决问题

将自定义样式添加到 react-sortable-tree

add custom style to react-sortable-tree

reactjs

react-sortable-hoc