
本文共 2447 字,大约阅读时间需要 8 分钟。
���������������������������������������������������������������
������ Vue ������������������������������
������������������������������������������ messagebox.vue
������������������������������������������������
������ CSS ������������
��������������������������� CSS ������������������������������������������������������������������ bootstrap
������������ CSS���
.message-box { position: fixed; z-index: 1000; left: 50%; top: 50%; transform: translate(-50%, -50%); background: rgba(0, 0, 0, 0.5); padding: 20px; border-radius: 8px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); color: white;}.message-box-header { padding: 15px 20px; border-bottom: 1px solid #cccccc;}.message-box-title { margin: 0; font-size: 18px; color: #fff;}.message-box-content { padding: 20px; font-size: 16px;}.message-box-btns { display: flex; justify-content: flex-end; gap: 10px;}.btn-lime { background-color: #4CAF50; color: white;}.btn-dark { background-color: #4e4e4e; color: white;}.message-box-enter { animation: enter 0.3s ease-out;}@keyframes enter { from { opacity: 0; transform: translateY(-20px); } to { opacity: 1; transform: translateY(0); }}@keyframes exit { from { opacity: 1; transform: translateY(0); } to { opacity: 0; transform: translateY(20px); }}
���������������������
��� Vue ������������������������������ MessageBox
������������������ main.js
���������������������������������
// src/assets/js/main.jsimport MessageBox from './components/MessageBox/messageBox'Vue.use(MessageBox)// ��� Vue ������������������this.$messageBox.showMsgBox({ title: '������', content: '���������������������������'}).then(() => { console.log('������������')}).catch(() => { console.log('������������')})
���������������
���������������������������������������������������������������������������������������������������������������������������������������
������������������������������������������
��������������� sass-loader ��� node-sass ������������������������������������������������
cnpm install sass-loader@7.0.3 surgically -Dcnpm install node-sass@4.7.2 -D
������������������������������������������������������������������������������������������������������������������������������������������������������
发表评论
最新留言
关于作者
