报错位置
去掉v-if="m.meta.noMenu" 不报错,下面的m.meta.noMenu正常显示值
组件全部代码
<template>
<div :class="['py-4 flex flex-col bg-indigo-100 relative lg:flex lg:rounded-b-sm', !menuSwitch?'flex':'hidden']">
<div v-for="(m,i) in menus" v-if="m.meta.noMenu"
:class="['flex flex-row items-center pl-[20px] space-x-3 hover:bg-gray-100 text-sm leading-[45px]',currRoute==m.name?'bg-gray-100':'']"
@click="clickMenu(m.name,i)">
<SvgIcon :name="m.meta.icon" class="w-[20px] h-[20px]" />
<div>{{m.meta.title}}</div>
{{m.meta.noMenu}}
<SvgIcon name="right" class="w-[20px] h-[20px] absolute right-2" v-show="currRoute==m.name" />
</div>
</div>
</template>
<script setup>
import {
ref,
reactive
} from 'vue'
import {
useRoute,
useRouter
} from 'vue-router'
import mu from '../router/menu/menu.js'
//reactive:定义响应式变量,一般用于定义引用数据类型。如果是基本数据类型,建议使用ref来定义。
var menus = reactive(mu);
defineProps({
menuSwitch: Boolean
})
const route = useRoute()
const router = useRouter()
console.log(JSON.stringify(route.name))
var currRoute = ref(route.name);
const clickMenu = (rt, i) => {
console.log(rt)
router.push({
name: rt
});
currRoute.value = rt
}
</script>
<style>
</style>