Невозможно управлять интерфейсом antd-mobile switch
Я хочу обновить пользовательский интерфейс на основе comfirm alert, как выполнить обновление пользовательского интерфейса на основе кнопок подтверждения "ok" и "cancel".
import React, { PureComponent } from 'react';
import { Switch, Modal } from 'antd-mobile';
import { createForm } from 'rc-form';
import PropTypes from 'prop-types';
const { alert } = Modal;
class RcSwitch extends PureComponent {
showAlert = checked => {
const { form } = this.props;
const alertInstance = alert(
'Disable autopay?',
'This will no longer monitor your bills for late payments',
[
{
text: 'Cancel',
onPress: () => {
console.log('cancel');
form.setFieldsValue({
Switch: !checked,
});
},
style: 'default',
},
{
text: 'Disable',
onPress: () => {
console.log('ok');
form.setFieldsValue({
Switch: checked,
});
},
},
]
);
setTimeout(() => {
console.log('auto close');
alertInstance.close();
}, 500000);
};
render() {
const { form } = this.props;
const { getFieldProps } = form;
return (
<Switch
{...getFieldProps('Switch', {
initialValue: true,
valuePropName: 'checked',
// onChange: val => console.log(val),
})}
onClick={checked => {
// set new value
if (checked) {
console.log('checked', checked);
form.setFieldsValue({
Switch: checked,
});
}
if (!checked) {
this.showAlert(checked);
}
}}
/>
);
}
}
const MySwitch = createForm()(RcSwitch);
export default MySwitch;
если я нажимаю на переключатель, то должно появиться предупреждение, но пользовательский интерфейс не должен обновляться в это время, на основе кнопок "ОК" или "Отмена" я хочу обновить пользовательский интерфейс. но теперь обновление пользовательского интерфейса происходит, как только я нажимаю на переключатель.