Files
YGChatCS/pages/chat/ChatTopNavBar.vue

48 lines
936 B
Vue

<template>
<view class="nav-bar">
<view class="nav-item" @click="showDrawer('showLeft')">
<image class="nav-item-icon" src="/static/drawer_icon.png" mode="aspectFit"></image>
</view>
<uni-drawer ref="showLeft" mode="left" :width="320">
<DrawerHome @closeDrawer="closeDrawer('showLeft')" />
</uni-drawer>
</view>
</template>
<script setup>
import { defineEmits, ref } from 'vue'
import DrawerHome from "@/pages/drawer/DrawerHome.vue";
const showLeft = ref(false)
// 打开窗口
const showDrawer = (e) => {
showLeft.value.open()
}
// 关闭窗口
const closeDrawer = (e) => {
showLeft.value.close()
}
</script>
<style lang="scss" scoped>
.nav-bar {
display: flex;
align-items: center;
height: 44px;
padding: 0 15px;
.nav-item {
width: 24px;
height: 24px;
margin-right: 10px;
}
.nav-item-icon {
width: 100%;
height: 100%;
}
}
</style>