Welink React-ui基础组件imeline

举报
云会议运营喵大人 发表于 2020/02/21 17:51:55 2020/02/21
【摘要】 imelineTimeline UI提供与WeLink规范一致的视图参数说明名称类型默认值说明dataarray时间轴数据,例如:[{ status: 'fail', date: '18/01/05', title: '筛选中', personInfo: '张三', cycle: '周期:2天', overdue: '已超期 1 天' }]import React from 'react';...

imeline


Timeline UI提供与WeLink规范一致的视图

参数说明

名称类型默认值说明
dataarray
时间轴数据,例如:[{ status: 'fail', date: '18/01/05', title: '筛选中', personInfo: '张三', cycle: '周期:2天', overdue: '已超期 1 天' }]

import React from 'react';
import { Timeline } from '@wecode/react-weui';

export default class TimelineDemo extends React.Component {
  state = {
    data: [
      {
        status: 'current',
        date: '18/01/05',
        title: '筛选中',
        personInfo: '张三',
        cycle: '周期:2天',
        overdue: '已超期 1 天'
      },
      {
        status: 'success',
        date: '18/01/05',
        title: '筛选中',
        personInfo: '张三',
        cycle: '周期:2天',
        overdue: '已超期 1 天'
      },
      {
        status: 'fail',
        date: '18/01/05',
        title: '筛选中',
        personInfo: '张三',
        cycle: '周期:2天',
        overdue: '已超期 1 天'
      },
      {
        status: 'complete',
        date: '18/01/05',
        title: '筛选中',
        personInfo: '张三',
        cycle: '周期:2天',
        overdue: '已超期 1 天'
      },
      {
        status: 'complete',
        date: '18/01/05',
        title: '筛选中',
        personInfo: '张三',
        cycle: '周期:2天',
        overdue: '已超期 1 天'
      }
    ]
  };

  render() {
    const { data } = this.state;
    return (
      <section>
        <Timeline data={data} />
      </section>
    );
  }
}


【版权声明】本文为华为云社区用户原创内容,未经允许不得转载,如需转载请自行联系原作者进行授权。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。