Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feaT: button loading 本身没问题 #15

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

feaT: button loading 本身没问题 #15

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions packages/kzui/src/components/base/animation.less
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,11 @@
@css-prefix-animation: ~"@{css-prefix}-animation";

.keyframes(@name, @rules) {
@keyframes @name {
@rules();
}
}

.keyframes(~"@{css-prefix-animation}-circle", {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
Expand Down
9 changes: 7 additions & 2 deletions packages/kzui/src/components/table/TableBody.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -104,7 +104,10 @@ const TableBody:React.FC<{
// )
// }
// }
// 简化上面的逻辑，解决 render 中使用 hook 会报错的问题。
// 简化上面的逻辑
// TODO 解决 render 中使用 hook 会报错的问题。
console.log(typeof item.render, 'item render type')
// @ts-ignore
const component =
item.render?.(item.dataIndex ? {
data,
Expand All @@ -126,7 +129,9 @@ const TableBody:React.FC<{
>
{
item.render ? (
(children || component)
// (children || component)
// @ts-ignore
children || <item.render data={data} index={index} item={item.dataIndex ? data[item.dataIndex] : null} />
) : data[item['dataIndex']]
}
</td>
Expand Down
100 changes: 52 additions & 48 deletions packages/kzui/src/components/table/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,41 @@
*/
import React, { useState } from 'react';
import { Table } from '@kzui/core';

const originDataSource = [
{
one: '1',
two: '1',
three: '2',
key: 1,
},
{
one: '2',
two: '2',
three: '3',
key: 2,
},
{
one: '3',
two: '3',
three: '4',
key: 3,
},
{
one: '3',
two: '3',
three: '4',
key: 4,
},
{
one: '3',
two: '3',
three: '4',
key: 5,
}
];
export default () => {
const [dataSource, setDataSource] = useState(originDataSource)
const columns = [
{
title: 'col 1',
Expand Down Expand Up @@ -37,56 +71,26 @@ export default () => {
}
];

const dataSource = [
{
one: '1',
two: '1',
three: '2',
key: 1,
},
{
one: '2',
two: '2',
three: '3',
key: 2,
},
{
one: '3',
two: '3',
three: '4',
key: 3,
},
{
one: '3',
two: '3',
three: '4',
key: 4,
},
{
one: '3',
two: '3',
three: '4',
key: 5,
}
];

const [selectedKeys, setSelectedKeys] = useState([])
return (
<Table
columns={columns}
dataSource={dataSource}
strip
bordered
rowSelectable
rowSelection={{
selectedRowKeys: selectedKeys,
onChange: ({ selectedRowKeys }) => {
setSelectedKeys(selectedRowKeys)
},
type: 'checkbox'
// maxSelect: 3
}}
/>
<div>
<Table
columns={columns}
dataSource={dataSource}
strip
bordered
rowSelectable
rowSelection={{
selectedRowKeys: selectedKeys,
onChange: ({ selectedRowKeys }) => {
setSelectedKeys(selectedRowKeys)
},
type: 'checkbox'
// maxSelect: 3
}}
/>
<div onClick={() => setDataSource(source => source.slice(0, 4))}>删掉一条数据</div>
</div>
);
}

Expand Down
2 changes: 1 addition & 1 deletion packages/kzui/src/components/table/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ export interface ColumnsProps {
title: string | React.ReactNode, // 列标题（列表头内容）
key: string, // React map 时需要的 key
dataIndex?: string, // 列数据在数据项中对应的 key
render?: (props: {data?: any, item?: any, index?: number}) => React.ReactNode | { children: React.ReactNode, props?: any }, // 生成复杂数据的渲染函数，参数分别为当前行数据，(当前行的值，如果有 dataIndex 的话)行索引，@return 里面可以设置表格行/列合并
render?: React.FC<{data?: any, item?: any, index?: number}> | ((props: {data?: any, item?: any, index?: number}) => React.ReactNode | { children: React.ReactNode, props?: any }), // 生成复杂数据的渲染函数，参数分别为当前行数据，(当前行的值，如果有 dataIndex 的话)行索引，@return 里面可以设置表格行/列合并
align?: 'left' | 'center' | 'right', // TODO 设置列的对齐方式
colSpan?: number, // 表头列合并,设置为 0 时，不渲染
width?: string | number, // 列宽度
Expand Down
2 changes: 1 addition & 1 deletion packages/kzui/src/utils.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -269,7 +269,7 @@ export const getStyle = (el, k) => {
let ret;
const rupper = /([A-Z]|^ms)/g;
name = name.replace(rupper, '-$1').toLowerCase();
const defaultView = elem.ownerDocument.defaultView;
const defaultView = elem.ownerDocument && elem.ownerDocument.defaultView;
if (!defaultView) {
return undefined;
}
Expand Down