Problème de style React-Toastify dans TypeScript - Impossible de définir z-index pour le conteneur Toast
P粉529581199
2023-08-28 17:00:25
<p>Je développe actuellement une application React utilisant TypeScript et intégrant la bibliothèque React-Toastify pour afficher les notifications. </p>
<p>Cependant, j'ai rencontré des problèmes de style avec le composant ToastContainer. Plus précisément, je souhaite définir l'index z de ToastContainer sur 1 000, mais j'ai essayé sans succès de le faire en utilisant des styles en ligne. </p>
<pre class="brush:php;toolbar:false;"><ToastContainer
style={{ fontSize : "14px", zIndex : "1000" }}
fermeture automatique={2000}
hideProgressBar={true}
/></pré>
<p>Malgré la définition de l'index z sur 1 000, ToastContainer n'apparaît pas au-dessus des autres éléments comme prévu. J'ai également vérifié s'il existe d'autres styles CSS affectant le composant, mais cela ne semble pas être le cas. </p>
<p>J'ai fait des recherches sur ce problème en ligne et essayé diverses solutions suggérées par la communauté, telles que l'utilisation de CSS global et le remplacement de styles via des classes, mais aucune n'a fonctionné. </p>
<p>Quelqu'un peut-il me guider sur la façon de résoudre les problèmes de style avec le composant ToastContainer et de définir correctement le z-index ? </p>
C'est l'élément injecté
C'est l'attribut
div
的样式。我没有看到任何position
设置。如果您添加position
et votre code devrait fonctionner