[英]KeyboardDatePicker MaterialUI - custom mask format
When using Material UI's KeyboardDatePicker it doesn't allow users to input letters when the format is dd/MMM/yyyy (ex. 26/Apr/1983).使用 Material UI 的 KeyboardDatePicker 时,当格式为 dd/MMM/yyyy(例如 1983 年 4 月 26 日)时,它不允许用户输入字母。 How would I create a mask to create a custom format?
我将如何创建掩码来创建自定义格式?
My attempt so far has been something like this:到目前为止,我的尝试是这样的:
<KeyboardDatePicker
mask={[
/\d/,
/\d/,
"/",
/[a-zA-Z]/,
/[a-zA-Z]/,
/[a-zA-Z]/,
"/",
/\d/,
/\d/
]}
format="dd/MMM/yyyy"
placeholder="DD/MMM/YYYY"
label="Date of birth"
openTo="year"
views={["year", "month", "date"]}
value={selectedDate}
/>
Mask can accept string
only so in your case, the regex array will not work.掩码只能接受
string
,因此在您的情况下,正则表达式数组将不起作用。
There is another flag called refuse
which can be used to refuse the pattern in the input.还有另一个名为reject 的标志可用于
refuse
输入中的模式。 We can make use of it to allow alphabetic input.我们可以利用它来允许字母输入。
Here is the codesandbox:这是代码框:
https://codesandbox.io/s/material-ui-pickers-keyboard-birthdate-forked-hmtgv?file=/src/index.js https://codesandbox.io/s/material-ui-pickers-keyboard-birthdate-forked-hmtgv?file=/src/index.js
const refusePattern = () => {
return /[^a-zA-Z0-9]+/gi; //reject the pattern which is not a-z, A-Z and 0-9
};
<KeyboardDatePicker
...
refuse={refusePattern()}
/>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.