Skip to content

mode 传参 month 字符串报错 #505

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

Open
leo2128 wants to merge 2 commits into
base: master
Choose a base branch
from
Open

mode 传参 month 字符串报错 #505

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
efc4532
feat: 增加sortCols 用于修改列表顺序
Jul 7, 2021
457b7d5
doc: readme更新
Nov 3, 2021
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
166 changes: 44 additions & 122 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,136 +1,58 @@
# rmc-date-picker
---

React Mobile DatePicker Component (web and react-native)


[![NPM version][npm-image]][npm-url]
![react-native](https://img.shields.io/badge/react--native-%3E%3D_0.30.0-green.svg)
![react](https://img.shields.io/badge/react-%3E%3D_15.2.0-green.svg)
[![build status][travis-image]][travis-url]
[![Codecov](https://img.shields.io/codecov/c/github/react-component/m-date-picker.svg?style=flat-square)](https://codecov.io/gh/react-component/m-date-picker)
[![gemnasium deps][gemnasium-image]][gemnasium-url]
[![node version][node-image]][node-url]
[![npm download][download-image]][download-url]

[npm-image]: http://img.shields.io/npm/v/rmc-date-picker.svg?style=flat-square
[npm-url]: http://npmjs.org/package/rmc-date-picker
[travis-image]: https://img.shields.io/travis/react-component/m-date-picker.svg?style=flat-square
[travis-url]: https://travis-ci.org/react-component/m-date-picker
[gemnasium-image]: http://img.shields.io/gemnasium/react-component/m-date-picker.svg?style=flat-square
[gemnasium-url]: https://gemnasium.com/react-component/m-date-picker
[node-image]: https://img.shields.io/badge/node.js-%3E=_0.10-green.svg?style=flat-square
[node-url]: http://nodejs.org/download/
[download-image]: https://img.shields.io/npm/dm/rmc-date-picker.svg?style=flat-square
[download-url]: https://npmjs.org/package/rmc-date-picker

## Screenshots

### web

<img src="https://img.alicdn.com/tps/TB1nH_4KpXXXXaCXFXXXXXXXXXX-404-607.png" width="288"/>

### ios

<img src="https://img.alicdn.com/tps/TB1saD1KpXXXXb_XFXXXXXXXXXX-420-729.png" width="288"/>

### android

<img src="https://img.alicdn.com/tps/TB1APgXKpXXXXXZXpXXXXXXXXXX-1920-1080.png" width="400"/>

## Usage

see example
# rmc-date-picker-plus

## Development

```
npm i
npm start
```

## Example

http://localhost:8000/examples/

online example: http://react-component.github.io/m-date-picker/
---

## react-native
支持用`sortCols`来调整年月日位置

```
npm run rn-init
npm run watch-tsc
react-native start
react-native run-ios
```
Support using `sortCols` to adjust the position of the year, month, and day

## install

[![rmc-date-picker](https://nodei.co/npm/rmc-date-picker.png)](https://npmjs.org/package/rmc-date-picker)

[![rmc-date-picker-plus](https://nodei.co/npm/rmc-date-picker-plus.png)](https://npmjs.org/package/rmc-date-picker-plus)

## API

### DatePicker props

| name | description | type | default |
|----------|----------------|----------|--------------|
|className(web) | additional css class of root dom node | String | '' |
|prefixCls(web) | prefix class | String | 'rmc-date-picker' |
|pickerPrefixCls(web) | picker prefix class | String | 'rmc-picker' |
|defaultDate | default selected date. | Date | |
|date | The currently selected date. | Date | |
|mode | The date picker mode. | String | 'date' enum('date', 'time', 'datetime', 'year', 'month') |
|minDate | min date | Date | `new Date(2000, 1, 1, 0, 0, 0)` |
|maxDate | max date | Date | `new Date(2030, 1, 1, 23, 59, 59)` |
|minHour | min Hour `[0, 23]`| Number | `0` |
|maxHour | max Hour `[0, 23]`| Number | `23` |
|minMinute | max Minute `[0, 59]`| Number | `0` |
|maxMinute | max Minute `[0, 59]`| Number| `59` |
|locale | the locale of area | Object | import from 'rmc-date-picker/lib/locale/en_US' |
|use12Hours | 12 hours display mode | Boolean | false |
|minuteStep | The amount of time, in minutes, between each minute item. | Number | 1 |
|onDateChange | Date change handler. | Function(date: Date) | '' |
|onValueChange | fire when picker change | (vals: any, index: number) => void | |
|formatMonth | Customize display value of months | (month:number, current:Date) => React.Node | |
|formatDay | Customize display value of days | (day:number, current:Date) => React.Node | |
| name | description | type | default |
| -------------------- | -------------------------------------------------------------------------------- | ------------------------------------------ | -------------------------------------------------------- |
| **sortCols(web)** | **用于调整年月日排列的顺序 Used to adjust the order of the year, month and day** | String | { year: 0, month: 1, day: 2} |
| className(web) | additional css class of root dom node | String | '' |
| prefixCls(web) | prefix class | String | 'rmc-date-picker' |
| pickerPrefixCls(web) | picker prefix class | String | 'rmc-picker' |
| defaultDate | default selected date. | Date | |
| date | The currently selected date. | Date | |
| mode | The date picker mode. | String | 'date' enum('date', 'time', 'datetime', 'year', 'month') |
| minDate | min date | Date | `new Date(2000, 1, 1, 0, 0, 0)` |
| maxDate | max date | Date | `new Date(2030, 1, 1, 23, 59, 59)` |
| minHour | min Hour `[0, 23]` | Number | `0` |
| maxHour | max Hour `[0, 23]` | Number | `23` |
| minMinute | max Minute `[0, 59]` | Number | `0` |
| maxMinute | max Minute `[0, 59]` | Number | `59` |
| locale | the locale of area | Object | import from 'rmc-date-picker/lib/locale/en_US' |
| use12Hours | 12 hours display mode | Boolean | false |
| minuteStep | The amount of time, in minutes, between each minute item. |  Number | 1 |
| onDateChange | Date change handler. | Function(date: Date) | '' |
| onValueChange | fire when picker change | (vals: any, index: number) => void | |
| formatMonth | Customize display value of months | (month:number, current:Date) => React.Node | |
| formatDay | Customize display value of days | (day:number, current:Date) => React.Node | |

### rmc-date-picker/lib/Popup props

| name | description | type | default |
|----------|----------------|----------|--------------|
|className(web) | additional css class of modal node | String | '' |
|style(web) | additional modal style | object | {} |
|popupTransitionName(web) | | String | |
|maskTransitionName(web) | | String | |
|prefixCls(web) | popup's prefix class | String | 'rmc-picker-popup' |
|styles(react-native) | PopupPicker's styles | StyleSheet.create | |
|datePicker | DatePicker element | React DatePicker element | |
|date | The currently selected date. | Date | |
|visible | whether pop picker is visible | Boolean | false |
|onChange | exec on ok | Function(date: Date) | |
|onVisibleChange | called when pop picker visible change | Function | |
|onDismiss | exec on dismiss | function | |
|okText | ok button text | string/React.ReactElement | 'Ok' |
|dismissText | dismiss button text | string/React.ReactElement | 'Dismiss' |
|title | Popup title | string/React.ReactElement | '' |


## Test Case

```
npm test
npm run chrome-test
```

## Coverage

```
npm run coverage
```

open coverage/ dir

## License

rmc-date-picker is released under the MIT license.
| name | description | type | default |
| ------------------------ | ------------------------------------- | ------------------------- | ------------------ |
| className(web) | additional css class of modal node | String | '' |
| style(web) | additional modal style | object | {} |
| popupTransitionName(web) | | String | |
| maskTransitionName(web) | | String | |
| prefixCls(web) | popup's prefix class | String | 'rmc-picker-popup' |
| styles(react-native) | PopupPicker's styles | StyleSheet.create | |
| datePicker | DatePicker element | React DatePicker element | |
| date | The currently selected date. | Date | |
| visible | whether pop picker is visible | Boolean | false |
| onChange | exec on ok | Function(date: Date) | |
| onVisibleChange | called when pop picker visible change | Function | |
| onDismiss | exec on dismiss | function | |
| okText | ok button text | string/React.ReactElement | 'Ok' |
| dismissText | dismiss button text | string/React.ReactElement | 'Dismiss' |
| title | Popup title | string/React.ReactElement | '' |
12 changes: 6 additions & 6 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,20 +1,20 @@
{
"name": "rmc-date-picker",
"version": "6.0.10",
"name": "rmc-date-picker-plus",
"version": "6.0.18",
"description": "React Mobile DatePicker Component for web and react-native",
"keywords": [
"react",
"react-component",
"react-mobile-date-picker",
"date-picker"
],
"homepage": "https://github.com/react-component/m-date-picker",
"homepage": "https://github.com/steveyu2/m-date-picker",
"repository": {
"type": "git",
"url": "https://github.com/react-component/m-date-picker.git"
"url": "https://github.com/steveyu2/m-date-picker.git"
},
"bugs": {
"url": "https://github.com/react-component/m-date-picker/issues"
"url": "https://github.com/steveyu2/m-date-picker/issues"
},
"files": [
"lib",
Expand Down Expand Up @@ -81,4 +81,4 @@
"babel-runtime": "6.x",
"rmc-picker": "~5.0.0"
}
}
}
Loading