J'ai commencé un nouveau projet laravel hier. J'ai suivi le guide d'un gars sur YouTube. Tout fonctionne jusqu'à ce que j'installe laravel auth et que je réalise qu'aucune des listes déroulantes d'amorçage ne fonctionne, même lorsque j'en crée une nouvelle depuis leur site Web.
Premièrement, je pensais avoir gâché quelque chose dans composer, parce que je voulais me débarrasser du bootstrap et plus tard j'ai changé d'avis et l'ai remis en place. Ensuite, j'ai créé un nouveau projet Laravel et je suis reparti de zéro. Même dans ce cas, mes listes déroulantes ne fonctionnent pas. J'ai recherché des problèmes similaires dans Google, mais aucun n'a aidé.
4 Réponses :
Il semble que votre bootstrap n'ait pas du tout été chargé. Assurez-vous d'inclure la bibliothèque d'amorçage dans votre vue. Si vous utilisez WebPack, vérifiez si vous mélangez les bibliothèques externes en une seule et incluez celle-ci dans votre fichier lame principal.
J'ai eu le même problème, cela se produit car bootstrap n'a pas été chargé correctement et je l'ai simplement résolu en collant ce lien dans la balise
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script>
et collez-le dans la région inférieure de la balise <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">
Par défaut, bootstrap.bundle.js n'est pas inclus dans votre application Laravel. Pour ajouter ceci:
Ouvrez le fichier 'resources / js / bootstrap.js' et ajoutez le code suivant à la dernière ligne de ce fichier.
require('bootstrap/dist/js/bootstrap.bundle');
Appuyez sur Enregistrer et exécutez npm run dev et cela fonctionnera enfin!
Parfois, vous devriez changer l'ordre des liens de script pour que cela fonctionne
Merci pour votre contribution. Votre suggestion peut être utile, mais se lit plus comme un commentaire que comme une réponse complète et autonome, conformément aux directives de SO. Veuillez mettre à jour avec des détails sur la façon d'exécuter votre suggestion. Les liens sont également très bien, avec la mise en garde que les informations pertinentes doivent également être intégrées dans votre publication, elles sont donc valides même si les informations sur cette page changent ou si le lien devient indisponible. Les réponses avec lien uniquement et incomplètes sont déconseillées et pourraient être supprimées. Gardez à l'esprit que la plupart des réponses sur SO nécessitent le code exact nécessaire pour résoudre le problème du PO. Ou simplement publier comme commentaire à la place
Cela ne répond pas à la question. Une fois que vous aurez une réputation suffisante, vous pourrez commenter n'importe quel message ; à la place, fournit des réponses qui ne nécessitent pas de clarification de la part du demandeur . - De l'avis
Les étapes de débogage seraient les suivantes: - Ouvrez la console de développement de votre navigateur et vérifiez les éventuelles erreurs, par exemple la bibliothèque d'amorçage n'a pas pu se charger parce que vous manquez un script jquery. Vérifiez la version de bootstrap que vous avez dans votre projet. Tout le reste fonctionne-t-il sauf dans la liste déroulante? Partagez du code pour que nous puissions peut-être vous aider.
Il n'y a aucune erreur dans la console. Comme je le vois dans le fichier package.json, je lance "bootstrap": "^ 4.0.0" et "popper.js": "^ 1.12". Et quelle partie du code aimeriez-vous voir?
Donc, en suivant la documentation ici , tout va bien de votre côté?
Il s'avère que certains de ces exemples ne fonctionnent pas non plus. Par exemple, lorsque j'ajoute un exemple d'en-têtes de menu à mon code, il n'apparaît pas dans la page, mais je vois le code html dans la console de développement. Seuls les boutons fonctionnent, mais sans fonction déroulante.
Cela signifie donc que votre bootstrap n'a pas du tout été chargé. Assurez-vous d'inclure la bibliothèque d'amorçage dans votre vue. Si vous utilisez webpack, vérifiez si vous mélangez les bibliothèques externes en une seule et incluez celle-ci dans votre fichier lame principal.
OK, j'ai ajouté
Envisagez-vous d'utiliser Vue? Sinon, supprimez l'exemple de code Vue de votre app.js. Ou si vous le faites, créez un élément avec un
id = "app"dans votre fichier lame afin que le composant vue puisse être instancié.@nakov, vous pouvez ajouter votre commentaire précédent (avec la bibliothèque non chargée) comme réponse. Cela m'a juste aidé. J'ai séparé les bibliothèques du fournisseur de l'application js et je me grattais la tête: P
@beerwin Merci. Je l'ai fait.