?引入Elementplus之后，在setup（）方法外面導(dǎo)入ElMessageBox
const {ElMessageBox} = ElementPlus
源碼 ：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<!-- import Vue before Element -->
<script src="../js/vue3.3.8/vue.global.js"></script>
<link rel="stylesheet" href="../js/elementPlus/index.css">
<script src="../js/elementPlus/index.full.js"></script>
<title></title>
</head>
<body>
<div id="app">
<!-- 雙大括號語法，可以直接拿到下面data中return 里面的數(shù)據(jù) -->
{{ message }}
<el-button type="success" @click="showModal('吃了嗎？')">成功按鈕</el-button>
</div>
</body>
<script>
const {createApp, ref} = Vue
const {ElMessageBox} = ElementPlus
const app = createApp({
setup() {
const message = ref('Hello vue!')
const showModal = (message) => {
ElMessageBox.alert(
message,
'提示',
{
confirmButtonText: '確認',
callback: (res) => {
console.log('點擊了', res)
}
})
}
return {
message,showModal
}
}
})
app.use(ElementPlus)
app.mount('#app')
</script>
</html>
相關(guān)文章來源：http://www.zghlxwxcb.cn/news/detail-759002.html
在vue3項目嵌套 導(dǎo)入老項目 jQuery項目，減少重復(fù)開發(fā)-CSDN博客?文章來源地址http://www.zghlxwxcb.cn/news/detail-759002.html
到了這里，關(guān)于html 中vue3 的setup里調(diào)用element plus的彈窗 提示的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
