sxfad / react-admin

基于 Ant Design React 的管理系统架构
https://sxfad.github.io/react-admin
608 stars 169 forks source link

大佬,ralib的Table 我用rowClassName貌似不起作用呀! #116

Closed goudanz closed 3 years ago

goudanz commented 3 years ago

我的Table定义:


const [selectedIssueId, setSelectedIssueId] = useState(0);

async function handleRowClick(record) {
    const {id} = record;
    setSelectedIssueId(id);
}

<Table
      size="default"
      columns={columns}
      dataSource={dataSource}
      rowKey="id"
      pageNum={pageNum}
      pageSize={pageSize}
      rowClassName={record => {
          if (record.id === selectedIssueId) {
              return 'issue-line selected';
          }
          return 'issue-line';
      }}
      onRow={(record, index) => {
          return {
              onClick: () => handleRowClick(record, index),
          };
      }}
  />

less:

.issue-line {
    cursor: pointer;

    &.selected {
        background: #f0f5ff;
    }
    &:hover {
        background: #f0f5ff;
    }
}

image

悬浮和点击的时候 颜色还是不会变!

zkboys commented 3 years ago

样式需要加上global,否则是css module,class名字会被改变,对不上。 less:

:global{
  .issue-line {
      cursor: pointer;

      &.selected {
          background: #f0f5ff;
      }
      &:hover {
          background: #f0f5ff;
      }
  }
}
goudanz commented 3 years ago

样式需要加上global,否则是css module,class名字会被改变,对不上。 less:

:global{
  .issue-line {
      cursor: pointer;

      &.selected {
          background: #f0f5ff;
      }
      &:hover {
          background: #f0f5ff;
      }
  }
}

收到~!! 多谢大佬!

对了还有个小问题哈。Modal 在antd官方我没找到如何放大的api,ralib的ContentModal支持嘛?

就是比如Modal的右上角有个

这个ICON的按钮,我点击一下。Modal弹窗就扩大,然后点击恢复原状这样

zkboys commented 3 years ago

Modal这个没有,需要自己实现。

goudanz commented 3 years ago

Modal这个没有,需要自己实现。

好的,明白了。多谢大佬!