提示框功能ok
This commit is contained in:
@@ -6,29 +6,45 @@ const offcanvasTop = ref(null)
|
||||
let ov: Offcanvas
|
||||
const alertType=ref() // 可选值:'success', 'warning', 'danger', 'info'
|
||||
const alertText=ref()
|
||||
let autoCloseTimeout:number
|
||||
onMounted(() => {
|
||||
// 确保在组件挂载后初始化
|
||||
if (offcanvasTop.value) {
|
||||
ov = new Offcanvas(offcanvasTop.value)
|
||||
ov = new Offcanvas(offcanvasTop.value,{
|
||||
backdrop: false,
|
||||
})
|
||||
//ov.show();
|
||||
//console.log('Offcanvas initialized:', ov)
|
||||
}
|
||||
})
|
||||
|
||||
// function showOffcanvas() {
|
||||
// if (ov) {
|
||||
// ov.show()
|
||||
// }
|
||||
// }
|
||||
|
||||
function showAlert(type: string, text: string) {
|
||||
alertType.value = type;
|
||||
alertText.value = text;
|
||||
|
||||
alertType.value = type;
|
||||
//console.log(ov);
|
||||
if (ov) {
|
||||
ov.show()
|
||||
ov.hide();
|
||||
ov.show();
|
||||
if(autoCloseTimeout)
|
||||
{
|
||||
clearTimeout(autoCloseTimeout);
|
||||
}
|
||||
autoCloseTimeout=setTimeout(() => {
|
||||
//console.log("timeout");
|
||||
ov.hide();
|
||||
}, 5000);
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
showAlert
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
@@ -147,10 +163,10 @@ function showAlert(type: string, text: string) {
|
||||
<a class="btn-close" data-bs-dismiss="offcanvas" aria-label="close"></a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<!-- <div>
|
||||
<button @click="showAlert('success','success')">success</button>
|
||||
<button @click="showAlert('warning','warning')">warning</button>
|
||||
<button @click="showAlert('danger','danger')">danger</button>
|
||||
<button @click="showAlert('info','info')">info</button>
|
||||
</div>
|
||||
</div> -->
|
||||
</template>
|
||||
|
||||
@@ -14,8 +14,8 @@
|
||||
},
|
||||
"footer":{
|
||||
"doc":"文档",
|
||||
"license":"许可证",
|
||||
"source_code":"源代码",
|
||||
"license":"协议",
|
||||
"source_code":"源码",
|
||||
"copy":"版权 © 2025 Operations. 保留所有权利。"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,9 +5,12 @@
|
||||
|
||||
onMounted(() => {
|
||||
// 可以在这里调用mos.value的方法
|
||||
console.log('HomeView mounted', mos);
|
||||
//console.log('HomeView mounted', mos);
|
||||
});
|
||||
|
||||
function c(){
|
||||
mos.value?.showAlert("success","111");
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
@@ -15,7 +18,7 @@
|
||||
|
||||
<div>
|
||||
<MyOffcanvas ref="mos"/>
|
||||
<button >ttt</button>
|
||||
<button @click="c">ttt</button>
|
||||
111
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user