Giter Club home page Giter Club logo

adui's People

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

adui's Issues

Datepicker 展开后,点击 Select 组件无法收起

由于Select组件trigger默认不是 tabable 的,无法获取焦点,

而Datepicker/Datepicker.RangePicker有以下判断:

if (bool || (!bool && inputElement !== activeElement)) {

if (bool || (!bool && inputElement !== activeElement)) {

因此在 Datepicker 展开后,再点击 Select,inputElement 和 activeElement 相等,导致设置收起的逻辑失效。

这里考虑

  1. 如果onVisibleChange的调用来自用户或者rc-trigger,应该可以不用做此判断?
  2. 或者让Select接收键盘焦点(不过其他不接收焦点的元素也会有此问题)

TableColumn width 的问题

问题描述

当前 TableColumn 的 width 参数会传给 td, th 的 maxWidth。

maxWidth: resizedCol ? resizedCol.value : width || ""

在 table 列动会跟着筛选项目变更的场景下,使用起来会产生一些奇怪的问题,比如如果都是固定宽度的列,可能出现撑不满一行;比如只有一列没有传 width,会自动拉伸这一列,很大面积空白,显得非常突兀。

没撑满
image

大面积空白
image

期望效果
image

希望可以支持固定一列,剩余列按照各自比例拉伸占满一行。

方案

TableColumn 增加一个 baseWidth 的参数,支持用户传入列的默认 flex-grow 但是不影响 maxWidth

Table组件动态修改columns的fixed属性会导致样式错乱

原有N列(columns)时,默认固定前2列,columns发生变化时,
[{dataIndex: 1, fixed: true}, {dataIndex: 2, fixed: true}, {dataIndex: 3, fixed: false}, {dataIndex: 4, fixed: false}],会导致

新的columns改为
[{dataIndex: 0, fixed: true}, {dataIndex: 1, fixed: true}, {dataIndex: 2, fixed: false}, {dataIndex: 3, fixed: false}, {dataIndex: 4, fixed: false}]

后,
样式会错乱:
image

CodeBox:

https://codesandbox.io/s/boring-elbakyan-q5t2q3?file=/index.js

Table组件的onSelectChange事件建议支持传递当前行的状态和数据

背景:
table组件无法直接获取当前操作的行,如选中或取消选中,当前行的数据等,希望支持。

目前table组件只支持onSelectChange 事件,该事件只能全量获取所有已选中的keys,不能获取当前操作的行:
image

参考Tdesign,支持更多的参数:
image

或者参考antd,通过onSelect事件,它可以帮助用户获取当前选中的行:
image

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.