antd a-tree 横向显示

要实现 antd 的 a-tree 组件横向显示，你可以使用 CSS 来控制树的样式。首先，给 a-tree 的容器元素添加一个自定义的类名，比如 "horizontal-tree"。然后，定义以下 CSS 样式：

.horizontal-tree .ant-tree {
  display: flex;
  flex-direction: row;
}

.horizontal-tree .ant-tree li {
  margin-right: 16px; /* 调整节点之间的间距 */
}

.horizontal-tree .ant-tree li:last-child {
  margin-right: 0; /* 移除最后一个节点的右边距 */
}

接下来，在你的代码中将 a-tree 的容器元素添加 "horizontal-tree" 类名，即可实现横向显示的效果。

import React from 'react';
import { Tree } from 'antd';
import './styles.css'; // 引入上述定义的 CSS 样式

const HorizontalTree = () => {
  return (
    <div className="horizontal-tree">
      <Tree /* your tree props */ />
    </div>
  );
};

export default HorizontalTree;

这样，你就可以横向显示 antd 的 a-tree 组件了。记得根据实际需要调整 CSS 样式和节点间距。