В избыточной форме я хочу использовать средство выбора даты и времени с включенным ручным вводом даты. Я использовал maskedin для правильного формата. Он работает нормально со всеми браузерами для нормальной страницы.
При нажатии на ввод, он дает пустой экран в модальном, специфичном для сафари. Я не могу найти, в чем проблема с safari-modal-datepicker-maskedinput!
renderDateTimePicker = ({ input: { onChange, value }, showTime, id, meta, isRequired, readOnly,inputReadOnly }) => {
return (<div> <DateTimePicker
inputProps={{
component: props => <MaskedInput {...props} readOnly={readOnly || inputReadOnly} type="text"
mask={[ /\d/, /\d/, /\d/, /\d/,".",/\d/, /\d/, ".", /\d/, /\d/ ]} />
}}
onChange={onChange}
format="YYYY.MM.DD"
time={showTime}
id={id}
name="completion_date"
className="date_click"
placeholder={isRequired === true ? id + " *" : id}
value={!value ? null : new Date(value)}
/>{this.renderError(meta)}
</div>
);
}
Вот мой файл package.json:
{
"name": "reduxapi",
"version": "0.1.0",
"private": true,
"dependencies": {
"@devexpress/dx-grid-core": "^1.10.1",
"@devexpress/dx-react-core": "^1.10.1",
"@devexpress/dx-react-grid": "^1.10.1",
"@devexpress/dx-react-grid-material-ui": "^1.10.1",
"@material-ui/core": "^3.9.2",
"@material-ui/icons": "^3.0.2",
"@types/bootstrap.v3.datetimepicker": "^4.17.46",
"ag-grid": "^18.1.2",
"ag-grid-community": "^20.0.0",
"ag-grid-react": "^20.0.0",
"axios": "^0.18.0",
"bootstrap": "^3.4.0",
"bootstrap-datepicker": "^1.8.0",
"cryptr": "^4.0.2",
"datatables.net": "^1.10.19",
"eslint-config-react-app": "^4.0.1",
"faker": "^4.1.0",
"font-awesome": "^4.7.0",
"jquery": "^1.11.2",
"jspdf": "^1.5.3",
"jspdf-autotable": "^3.1.1",
"jwt-simple": "^0.5.5",
"moment": "^2.24.0",
"prop-types": "^15.6.2",
"query-string": "^6.2.0",
"react": "^16.7.0",
"react-autocomplete": "^1.8.1",
"react-autocomplete-input": "^1.0.10",
"react-autosuggest": "^9.4.3",
"react-awesome-modal": "^2.0.5",
"react-bootstrap": "^1.0.0-beta.5",
"react-confirm-alert": "^2.4.1",
"react-csv": "^1.1.1",
"react-data-grid": "^5.0.5",
"react-data-grid-addons": "^5.0.5",
"react-datepicker": "^2.1.0",
"react-dom": "^16.7.0",
"react-encrypt": "^1.0.1",
"react-grid-layout": "^0.16.6",
"react-helmet": "^5.2.1",
"react-moment": "^0.8.4",
"react-redux": "^6.0.0",
"react-router-dom": "^4.3.1",
"react-scripts": "2.1.3",
"react-select": "^2.4.1",
"react-text-mask": "^5.4.3",
"react-to-print-advanced": "^2.1.2",
"react-widgets": "^4.4.10",
"react-widgets-moment": "^4.0.27",
"react-widgets-moment-localizer": "^1.0.2",
"redux": "^4.0.1",
"redux-form": "^8.1.0",
"redux-multilanguage": "^0.1.2",
"redux-thunk": "^2.3.0",
"select2": "^4.0.6-rc.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
]
}