文章标题

Material UI -Date Picker 汉化

import React from 'react'
import DatePicker from 'material-ui/DatePicker'

function dateTimeFormat(locale, options) {
const dayAbbreviation = ['日', '一', '二', '三', '四', '五', '六'];
const dayList = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
const monthList = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'];
const monthLongList = ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'];

this.format = function (date) {
//console.log(date,options,locale)
if (options.month === 'short' && options.weekday === 'short' && options.day === '2-digit') {
return monthList[date.getMonth()] + date.getDate() + '日' + ' ' + dayList[date.getDay()];
} else if (options.day === 'numeric' && options.month === 'numeric' && options.year === 'numeric') {
return date.getFullYear() + '年' + (date.getMonth() + 1) + '月' + date.getDate() + '日';
} else if (options.month === 'long' && options.year === 'numeric') {
return date.getFullYear() + '年' + monthList[date.getMonth()];
} else if (options.weekday === 'narrow') {
return dayAbbreviation[date.getDay()];
} else if (options.day === 'numeric') {
return date.getDate();
} else if (options.year === 'numeric') {
return date.getFullYear();
} else {

}
};
}

const DatePickerCN = (props) => {
return (
<div style={{width:"200px",height:"200px",position:"fixed","bottom":"23px",left:"200px"}}>
<DatePicker
hintText='日期汉化测试'
okLabel='确定'
cancelLabel='取消'
DateTimeFormat={dateTimeFormat}
locale='en'
autoOk={false}
disableYearSelection={false}
textFieldStyle={{
fontSize: '13px',
width: '155px',
}}
style={{float:'left',}}
/>
</div>
)
}

export default DatePickerCN