[comp: divider]: feature divider component

[LaamGinghong]

• I have searched the issues of this repository and believe that this is not a duplicate.

What problem does this feature solve?

• 支持水平、垂直两种分割线（默认为水平分割线）；
• 支持分割线中显示文字（垂直分割线不支持显示文字）；
• 支持分割线文字显示在左、中、右（默认为中间）三种位置；
• 支持分割线文字显示为正常文本格式（默认为粗体）；
• 支持分割线样式为虚线；

What does the proposed API look like?

ix-divider

参数	说明	类型	默认值	备注
dashed	是否虚线	boolean	false	-
plain	文字是否显示为普通正文样式	boolean	false	-
position	文字显示位置	left | center | right	center	文字显示的位置有三种默认位置；垂直分割线文字不作样式处理。
type	水平分割线还是垂直分割线	horizontal| vertical	horizontal	-
text	分割线显示的文字	slot	-	-

[danranVm]

@huangtenghui @danranVm 负责此组件的 review， API 设计完成后请 @ 他们

[LaamGinghong]

@danranVm @huangtenghui please review this API

[danranVm]

很棒，不过有两点可能需要调整一下：

• className 和 style 的 API 不需要，因为我们本身是基于 template 的，用户可以直接在我们的的组件上使用 class 和 style
• 这几个默认值都可以放入到全局配置 useGlobalConfig 中，方便用户自定义

另外，关于 垂直分割线不支持修改为虚线， 是出于什么理由呢？ And Design 中是支持的。

[LaamGinghong]

很棒，不过有两点可能需要调整一下：

• className 和 style 的 API 不需要，因为我们本身是基于 template 的，用户可以直接在我们的的组件上使用 class 和 style
• 这几个默认值都可以放入到全局配置 useGlobalConfig 中，方便用户自定义

另外，关于 垂直分割线不支持修改为虚线， 是出于什么理由呢？ And Design 中是支持的。

@danranVm className 和 style 是之前写 React 的习惯了，至于 垂直分割线不支持修改为虚线 的原因在于我看 ant 给出的 demo 中明确表示了垂直分割线是作为 行内 的分割线，因此分割线通常会比较短，如果设置为虚线的话可能会比较不好看。

当然如果是我本身理解错了 ant 的的意思，我觉得可以修改为与他们的特性保持着一直。

[danranVm]

Ok, 垂直分割线还是支持虚线吧，这里没必要限制用户的使用。

我的建议就这些了。

[huangtenghui]

position希望能支持具体的位置，百分比这种，单单左中右满足不了使用场景，如图：

[LaamGinghong]

position希望能支持具体的位置，百分比这种，单单左中右满足不了使用场景，如图：

@huangtenghui 那可以做成既支持左中右三种默认位置，也支持输入字符串来自控制文字距离左端的位置

[LaamGinghong]

@huangtenghui @danranVm 已经修改了 API

[huangtenghui]

线是否应该支持粗细设置，颜色跟渐变？因为分割线在我们项目中更多的不是文本的隔离，而是模块间的隔离。有时候为了更直观可能会使用粗点的线，渐变色等等。这些靠style是否能满足？如果可以则无问题，不行的话，则需要考虑下

[danranVm]

线是否应该支持粗细设置，颜色跟渐变？因为分割线在我们项目中更多的不是文本的隔离，而是模块间的隔离。有时候为了更直观可能会使用粗点的线，渐变色等等。这些靠style是否能满足？如果可以则无问题，不行的话，则需要考虑下

这个我认为暂时不需要支持吧，这会让组件变得复杂。
用户可以通过设置 class 来实现这类需求。

[LaamGinghong]

线是否应该支持粗细设置，颜色跟渐变？因为分割线在我们项目中更多的不是文本的隔离，而是模块间的隔离。有时候为了更直观可能会使用粗点的线，渐变色等等。这些靠style是否能满足？如果可以则无问题，不行的话，则需要考虑下

这个似乎有点过度设计了，依照2b的场景，大部分情况下都不存在需要个性化的分割线，渐变和颜色我觉得依照设计稿来说应该是固定的，至于粗细这一点我觉得应该需要和设计进行讨论

[danranVm]

哈哈 他操作错了。 😆

[danranVm]

@LaamGinghong API 暂时就这么定吧，期待你的实现 🥇

[huangtenghui]

哈哈 他操作错了。 😆

哈哈，手机网页操作不太习惯

[huangtenghui]

线是否应该支持粗细设置，颜色跟渐变？因为分割线在我们项目中更多的不是文本的隔离，而是模块间的隔离。有时候为了更直观可能会使用粗点的线，渐变色等等。这些靠style是否能满足？如果可以则无问题，不行的话，则需要考虑下

这个似乎有点过度设计了，依照2b的场景，大部分情况下都不存在需要个性化的分割线，渐变和颜色我觉得依照设计稿来说应该是固定的，至于粗细这一点我觉得应该需要和设计进行讨论

可以。

[coolyuantao]

plain 这个配置是否有必要？如果只是加粗跟字体的变化，建议换个名字？另外这个本身已经支持插槽的方式了，感觉意义比较小

[LaamGinghong]

plain 这个配置是否有必要？如果只是加粗跟字体的变化，建议换个名字？另外这个本身已经支持插槽的方式了，感觉意义比较小

这个 API 是为了和 ant 保持一致的。divider 的文字默认是加粗，加了 plain 是变回原来的普通字体

[LaamGinghong]

@huangtenghui @danranVm 忘了说，分割线显示的文字以slot的形式注入，我修改了API，请review一下。🥲

[LaamGinghong]

同时我看了一下，antd确实是没有处理垂直分割线的文本样式，我们是否需要也支持 @huangtenghui @danranVm
这个是demo https://stackblitz.com/edit/react-lz95rj?file=App.jsx

[danranVm]

• text 也支持 props 传入一个 string?
• 我们之前讨论的不是垂直分割线支不支持虚线么？ 垂直分割线的时候，我们不对 text 做处理。

[danranVm]

fix with #62