发布作业

master
LeeNux 2 years ago
parent 8583a32713
commit 09390b2ef5

@ -0,0 +1,38 @@
<template>
<div class="drawer" v-show="show">
<div class="content">
<slot></slot>
<div class="footer" v-if="$slots.hasOwnProperty('footer')">
asd
<slot name="footer"></slot>
</div>
</div>
</div>
</template>
<script>
export default {
name: "VDrawer",
props: {
show: {default: false, type: Boolean}
}
}
</script>
<style scoped>
.drawer {
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.8);
}
.content {
position: absolute;
top: 10%;
left: 10%;
width: 80%;
height: 80%;
background-color: white;
}
</style>

@ -34,6 +34,10 @@ const router = createRouter({
path: 'axios',
name: 'axios',
component: () => import('../views/Axios.vue')
}, {
path: 'drawer',
name: 'drawer',
component: () => import('../views/Drawer.vue')
},]
}, {
path: '/pure',

@ -7,4 +7,5 @@ export default [
{title: "计算属性", path: '/computed'},
{title: "抽奖游戏", path: '/turntable'},
{title: "Axios", path: '/axios'},
{title: "InputNum", path: '/drawer'},
]

@ -0,0 +1,28 @@
<template>
<v-drawer v-model:show="show">
content
</v-drawer>
</template>
<script>
import {onMounted, ref} from "vue"
import VDrawer from "@/components/VDrawer.vue";
export default {
name: "Drawer",
components: {VDrawer},
setup() {
const show = ref(true)
onMounted(() => {
setInterval(() => {
show.value = !show.value
}, 1000)
})
return {show}
}
}
</script>
<style scoped>
</style>
Loading…
Cancel
Save