请问React的组件包编写,是否可以实现"继承"组件的功能?

请问一下,在React中是否可以实现这样的需求;

image.png

1、有一个BaseComponent
2、我以后写其他组件都是"继承"自BaseComponent(因为React中没有继承,可以看下是否可以通过其他方式实现,比如HOC高阶组件)
3、这里的"继承"主要是继承BaseComponent特征:
①左右的两个面板
②左右分割的比例(左右的两个面板可以通过中间的线进行拖拽进行控制编辑区和设置区的大小),也就是说比如A组件滑动到2:1,那么B组件也会滑动到2:1
(请问是否可以实现呢?如果不能实现,那么只实现①左右面板的继承也可以)

阅读 854
1 个回答
  1. React 类式组件是可以继承的。
  2. React 函数式组件不可以继承。
  3. React 并不推荐使用继承的方式来实现组件。
  4. React 推荐使用组合的方式来实现组件。

你可以通过组合嵌套的方式来实现这一需求。

const [value, setValue] = useState(50); // 使用 state 存储宽度。

return (<App>
  <A value={value} onChange={(value) => setValue(value)}>{...}</A> // 当宽度发生改变时更新 state。
  <B value={value} onChange={(value) => setValue(value)}>{...}</B>
  <C value={value} onChange={(value) => setValue(value)}>{...}</C>
</App>);

你说的这个组件是 splitter,以下是 ant-design 的 splitter 组件文档供你参考:https://ant-design.antgroup.com/components/splitter-cn

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题