Süße Alarm 2 nicht als modaler zeigt sich, wenn ein Alarm

Question

geworfen Ich gehe davon aus, dass ich das falsch sein importieren muss, wie einige, aber ich bin nicht sicher. Ich folgte den Anweisungen auf dem github. Er sagt, dass ich es npm install und dann nur import swal from 'sweetalert2'. Muss ich auch die js und css Dateien verwenden?

Was passiert, ist, dass ich eine seltsame Warnung in der unteren linken meinem Fenster git, die nicht weggeht.

Hier ist mein Code:

import React, { Component } from 'react'; 
import swal from 'sweetalert2'; 

class TestSwal extends Component { 
    componentDidMount() { 
    swal({ 
     title: 'Are you sure?', 
     text: 'You will not be able to recover this imaginary file!', 
     type: 'warning', 
     showCancelButton: true, 
     confirmButtonText: 'Yes, delete it!', 
     cancelButtonText: 'No, keep it' 
    }).then(
     function() { 
     swal('Deleted!', 'Your imaginary file has been deleted.', 'success'); 
     }, 
     function(dismiss) { 
     // dismiss can be 'overlay', 'cancel', 'close', 'esc', 'timer' 
     if (dismiss === 'cancel') { 
      swal('Cancelled', 'Your imaginary file is safe :)', 'error'); 
     } 
     } 
    ); 
    } 
    render() { 
    return <div>Test Swal</div>; 
    } 
} 

export default TestSwal; 

Answer 1

Update (Januar 2017): Ab v7 alle müssen Sie sowohl JS und CSS importieren ist:

import swal from 'sweetalert2' 

---

Wir haben vor kurzem v6.10.0 veröffentlicht, die all-in-one-Version mit JS enthält und CSS an einem Ort.

Sie können es auf diese Weise importieren:

import swal from 'sweetalert2/dist/sweetalert2.all.min.js' 

Answer 2

Sie sollten CSS-Datei enthalten:

import 'sweetalert2/dist/sweetalert2.min.css'; 

oder umfassen CDN Version in die HTML-Datei, wie in Usage section on Github gezeigt.