uniProject/components/btnMenu.vue

<template>
	<view>
		<uni-icons type="list" size="30" @click="showDrawer"></uni-icons>

		<uni-drawer ref="showLeft" mode="left" :width="320">
			<uni-collapse ref="collapse" accordion v-model="data.activeMenu">
				<uni-collapse-item :title="item.title" v-for="item in data.list" :key="item.title">
					<view v-for="cIt in item.children" :key="item.title" @click="handleClick(cIt)">
						<view class="content">
							<text class="text" :class="{active: data.activePath}">{{cIt.title}}</text>
						</view>
					</view>
				</uni-collapse-item>
			</uni-collapse>

			<view class="close">
				<button @click="closeDrawer('showLeft')"><text class="word-btn-white">关闭Drawer</text></button>
			</view>
		</uni-drawer>
	</view>
</template>

<script setup>
	import {
		ref,
		reactive
	} from "vue"
	const showLeft = ref(null)
	import { onLoad } from "@dcloudio/uni-app"
	
	const data = reactive({
		list: [{
				title: '1',
				url: '',
				children: [{
					title: '1-1',
					url: '/pages/dqgzDangjiangongzuo/dqgzDangjiangongzuo'
				}, {
					title: '1-2',
					url: 'http://www.baidu.com',
					type: 'link'
				}, {
					title: '1-3',
					url: ''
				}, {
					title: '1-4',
					url: ''
				}, ]
			},
			{
				title: '2',
				url: '',
				children: [{
					title: '2-1',
					url: ''
				}, {
					title: '2-2',
					url: ''
				}, {
					title: '2-3',
					url: ''
				}, {
					title: '2-4',
					url: ''
				}]
			}
		],
		activeMenu: null,
		activePath: '',
	})
	
	onLoad(() => {
		data.activePath = getCurrentPages().route;
		data.activeMenu = data.list.find(item => item.children.some(cit => cit.url == data.activePath));
		console.log( 'ccc:', data.activeMenu, data.activePath )
	})

	

	function showDrawer() {
		showLeft.value.open();
	}

	function closeDrawer() {
		showLeft.value.close();
	}

	function handleClick(data) {
		console.log(`菜单:${data.title};路径:${data.url}`);
		if (data.type == 'link') {
			window.location.href = data.url;
			return;
		}
		if (data.url) {
			uni.navigateTo({
				url: data.url
			})
		}
	}
</script>

<style>

</style>