Как использовать представить внутрь в Sweetalert2 реагировать - PullRequest
0 голосов
/ 05 февраля 2020

Я использую Sweetalert2 в компоненте реакции.

здесь код:

SaveChangesModal. js

import Swal from 'sweetalert2'

export default async function SaveChangesModal(message, callback) {
    const result = await Swal.fire({
        title: 'Save Changes!',
        type: 'warning',
        text: message,
        showCancelButton: true,
        cancelButtonText: 'No',
        confirmButtonText: 'Yes',
        allowOutsideClick: false,
        showConfirmButton: true,
    })
    if (result.value) {
        return callback(true)
    }
    return callback(true)
}

Открыть всплывающее окно Sweetalert в истории. js компонент

истории. js

import { createBrowserHistory } from 'history'
import SaveChangesModal from 'Common/SettingsForm/SaveChangesModal'

export default createBrowserHistory({
    async getUserConfirmation(message, callback) {
        return SaveChangesModal(message, callback)
    },
})

, и это путь маршрута для возврата истории . js страница, когда changeMade имеет значение true в SettingsForm. js component .

SettingsForm. js

UNSAFE_componentWillMount() {
        const { history } = this.props
        this.unblock = history.block(this.routeChange)
    }

    // eslint-disable-next-line consistent-return
    routeChange = () => {
        const { changesMade } = this.props
        if (changesMade)
            return 'Would you like to save your changes before leaving?'
    }

    componentWillUnmount() {
        this.unblock()
    }

Эти компонент работает нормально, но проблема в том, как использовать submit в sweetalert2, открывается всплывающее окно, и я нажимаю кнопку «Сохранить», тогда это условие истинно

if (result.value) {
        return callback(true)
    }

и страница не сохраняет данные и переходит на другую вкладку ,

Примечание : структура открывается после открытия всплывающего окна, нажатия кнопки сохранения и сохранения данных и перехода на другую вкладку

это всплывающее окно sweetalert2 :

enter image description here

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...