Bootstrap 5警告未关闭(使用Vue)



我正在一个Vue项目上工作,我不知道为什么这个警报没有关闭。注释掉部分是我最初想要的工作,但我用它代替了bootstrap网站上的代码,它仍然没有关闭。

<template>
<div class="container">
<!--<div style="height: 80px">
<div v-if='isError' class="alert alert-info alert-dismissible show animate__animated animate__fadeInLeft" role="alert">
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
{{loginError}}
</div>
</div>
-->
<div class="alert alert-success alert-dismissible fade show" role="alert">
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
<strong strong>Success!</strong> This alert will fade away when clicking the × button.
</div>
<div class="modal-dialog modal-login animate__animated animate__fadeInDown">
<div class="modal-content">
<div class="modal-header">
<div class="avatar text-center">
<i class="fas fa-user mt-2 fa-3x"></i>
</div>              
<h4 class="modal-title">Member Login</h4>   

</div>
<div class="modal-body">
<form action="" @submit.prevent>
<div class="form-group">
<input type="text" class="form-control mb-2 ipt" name="email" placeholder="Email" required="required" v-model="email">      
</div>
<div class="form-group">
<input type="password" class="form-control mb-3 ipt" name="password" placeholder="Password" required="required" v-model="password"> 
</div>        
<div class="form-group row px-3">
<button type="submit" @click="login" class="btn btn-primary btn-lg btn-block login-btn">Login</button>
</div>
</form>
</div>
<div class="modal-footer">
<router-link to='/Signup'>New user? Click here to sign up!</router-link>
</div>
</div>
</div>

旁注,由于某种原因,网站切断了我的模板结束标签。

我知道你正在使用VUE,但由于你没有显示整个代码,我认为错误是不工作,因为你没有启用引导,更具体地说,JavaScript

Мне

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet"/>
<div class="alert alert-warning alert-dismissible fade show" role="alert">
<strong>Holy guacamole!</strong> You should check in on some of those fields below.
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>

最新更新