Sweetalert2 React Content не работает вообще - PullRequest
Новая
       27

Sweetalert2 React Content не работает вообще

0 голосов
/ 27 апреля 2020

Мне не удается заставить работать мой Swal2 React Content. Я реализовал это так же, как руководство здесь: https://www.npmjs.com/package/sweetalert2-react-content

Хотя я продолжаю получать эту ошибку в консоли при попытке вызвать функцию: 

Uncaught (in promise) TypeError: Cannot call a class as a function
    at _classCallCheck (carousel.css:190)
    at _class (carousel.css:190)
    at File.tsx:34

Я использую крючки (пробовал тоже с классом - та же ошибка) с Typescript. Кто-то знает, что я здесь делаю не так? Я использую последнюю версию Sweetalert2 и Sweetalert2 React Content.

Мой код выглядит так: 

const SwalModal = withReactContent(Swal);

const File = (props: IProps) => {
    const submitForm = (e: any) => {
        e.preventDefault();

        APIsubmitForm(props)
            .then(response => {
                //Set props
            })
            .catch(error => {
                SwalModal({
                    title: <h1>Error</h1>,
                    html: <p>Errormessage</p>,
                    icon: "error",
                    onOpen: () => {
                        SwalModal.clickConfirm()
                      }
                }).then(() => {
                    return SwalModal.fire("<p>Shorthand works too</p>")
                });
            });
    };
......

Ответы [ 2 ]

0 голосов
/ 27 апреля 2020

Спасибо за ваш ответ. Я пробовал это решение тоже. Тогда я получаю эту ошибку: 

(property) SweetAlertOptions.title?: string | HTMLElement | JQuery<HTMLElement>
The title of the popup, as HTML. It can either be added to the object under the key title or passed as the first parameter of Swal.fire().

@default

''
No overload matches this call.
  Overload 1 of 2, '(title?: string, html?: string, icon?: SweetAlertIcon): Promise<SweetAlertResult>', gave the following error.
    Argument of type '{ title: JSX.Element; footer: string; onOpen: () => void; }' is not assignable to parameter of type 'string'.
  Overload 2 of 2, '(options: SweetAlertOptions): Promise<SweetAlertResult>', gave the following error.
    Type 'Element' is not assignable to type 'string | HTMLElement | JQuery<HTMLElement>'.
      Type 'Element' is missing the following properties from type 'JQuery<HTMLElement>': jquery, length, add, addBack, and 134 more.ts(2769)
sweetalert2.d.ts(399, 5): The expected type comes from property 'title' which is declared here on type 'SweetAlertOptions'
0 голосов
/ 27 апреля 2020

Вам нужно вызвать метод огня SwalModal вместо SwalModal

      SwalModal.fire({
                title: <h1>Error</h1>,
                html: <p>Errormessage</p>,
                icon: "error",
                onOpen: () => {
                    SwalModal.clickConfirm()
                  }
            }).then(() => {
                return SwalModal.fire("<p>Shorthand works too</p>")
            });

Использование согласно Readme on Git хранилище

...