UNPKG

@linkdesign/screen

Version:

屏组件库,但使用场景又不局限于屏。主要用于BI、大盘和屏

76 lines (49 loc) 1.7 kB
# 时间器 Timer ## 使用场景 时间显示 ## 预览 ![时间器 Timer](https://intranetproxy.alipay.com/skylark/lark/0/2020/png/111014/1580720054153-591a4835-9ebc-4505-b090-0de167c8c6ff.png) ## 演示 <!--before-content--> ## 基础用法 ```js import { Text, config } from '@linkdesign/screen'; const { Timer } = Text; const { _cssPrefix } = config; const header = { backgroundColor: "#1f3b6d", display: "flex", alignItem: "center", height: 56, padding: "0 24px", }; class App extends React.Component { render() { return ( <div data-theme="dark" className={`${_cssPrefix}main-body`} style={header}> <Timer /> </div> ); } } ReactDOM.render(<App />); ``` <!--after-content--> ### API | 参数名 | 说明 | 必填 | 类型 | 默认值 | 备注 | | ---------- | ------------------------------------------------------------ | ---- | ------ | ------ | ------------------------------------------------------------ | | className | 类名 | N | String | - | | | format | 时间格式 | N | String | ```'MM月DD日 HH:mm:ss'``` | [见monentjs 文档](https://momentjs.com/docs/#/displaying/format/) | | [textStyle](#textStyle) | 文本样式 | N | Object | ```{fontWeight: 400}``` | | #### textStyle ```typescript // 文本样式 textStyle?: { fontFamily?: string; fontSize?: string | number; color?: string; fontWeight?: string | number; }; ``` ## TODO List - [ ] ......