npm.io
1.1.2 • Published 5 years ago

react-cron-antd

Licence
MIT
Version
1.1.2
Deps
4
Size
122 kB
Vulns
1
Weekly
0
Stars
35

ReactCron

基于React及Antd的cron时间表达式生成器

效果图

特性

  • 全面支持cron:秒、分、时、日、月、周、年
  • 日及周条件互斥,自动改变响应值
  • 支持反解析cron表达式到UI
  • 可结合此组件与Antd的下拉及输入组件封装成下拉输入框

安装

npm install react-cron-antd
# 或
yarn add react-cron-antd
使用
import React from 'react';
import Cron from 'react-cron-antd';

function Page() {
    return <Cron value="* * * * * ? *" onOk={(value) => console.log('cron:', value)} />;
}

export default Page;
扩展

封装一个用于表单组件的CronInput。

import React from 'react';
import { Dropdown, Input } from 'antd';
import Cron from 'react-cron-antd';

function CronInput(props) {
    const { value, onChange } = props;

    return (
        <Dropdown
            trigger={['click']}
            placement="bottomLeft"
            overlay={<Cron value={value} onOk={onChange} />}
        >
            <Input.Search value={value} />
        </Dropdown>
    );
}

export default CronInput;
更新日志
LICENSE

MIT

Keywords