У меня есть TextField, который включает в себя поле response-text-mask для поля даты в моем коде, но я не могу понять, что мне нужно изменить, что позволит пользователям удалять «/» при необходимости.Прямо сейчас они могут удалить текущий раздел, в котором находится их курсор, и использовать клавиши со стрелками вправо или влево, чтобы перейти к другому разделу этой даты, но кнопка удаления не позволит перейти за "/".
Вот код TextField:
<Question
date
label="Inception Date"
value={this.state.inceptionDate}
onChange={this.onChange("inceptionDate")}
tabIndex={5}
/>
interface QuestionProps {
date?: boolean;
value: any;
label: string;
money?: boolean;
autoFocus?: boolean;
select?: boolean;
options?: Array<React.ReactElement<any>>;
tabIndex: number;
onChange: (e: React.SyntheticEvent<any>) => void;
}
const Question = (props: QuestionProps) => {
const inputProps = {
startAdornment: <InputAdornment position="start">{props.money ? "$" : ""}</InputAdornment>
};
let type = "text";
if (props.date) {
type = "date";
}
const t = (
<TextField
autoFocus={props.autoFocus}
select={props.select}
required
value={props.value}
label={props.label}
InputProps={inputProps}
inputProps={{ tabIndex: props.tabIndex }}
onChange={props.onChange}
variant="outlined"
style={{ marginBottom: "15px" }}
type={type}
InputLabelProps={{ shrink: true }}
fullWidth
>
{props.options}
</TextField>
);
return t;
Дата Маска код:
const dateMask = [/[1-9]/, /\d/, "/", /\d/, /\d/, /\d/, /\d/];
private onChange = (field: keyof State, type?: "date" | "number") => (e: React.FormEvent) => {
let val = (e.target as any).value;
if (type === "number") {
val = Numeral(val).format("0,0");
}
if (type === "date") {
const v = conformToMask(val, dateMask, { guide: true, keepCharPositions: true });
val = v.conformedValue;
}
this.setState({ [field]: val } as Pick<State, keyof State>);
};