react-split-pane 无法调整大小

Question

我刚刚在我的应用程序中安装了 react-split-pane，但它似乎不起作用。

我正在使用react-split-pane版本0.1.68，但我也使用0.1.66和0.1.64对其进行了测试。

这是我的组件：

import React, { Component } from 'react';
import SplitPane from 'react-split-pane';

class Edit extends Component {
  render() {
    return (
        <SplitPane split="vertical">
            <div style={{backgroundColor: 'red'}}>LEFT</div>
            <div style={{backgroundColor: 'blue'}}>RIGHT</div>
        </SplitPane>
    );
  }
}

export default Edit;

我最终得到了一个看起来像我设计的组件，但是在元素之间拖动来调整元素的宽度不起作用。

我在这里缺少什么？

Ps 这个问题可能与之相关，但我尝试了以前的版本，它们似乎也不起作用。

Answer 1

我也有类似的问题。分隔线不起作用的原因是： 缺少CSS

从教程添加 CSS：https://github.com/tomkp/react-split-pane#example-styling 到你的反应组件。例如：

import './edit.css';

您的拖动元素将会起作用。

Answer 2

找到了更好的解决方案。 全新的库： https://www.npmjs.com/package/ressized-panes-react