vue3，通过页面的按钮事件，在左侧栏目里增加菜单怎么实现？

  • Z时代
  • 2024-02-05
  • 分类：IT

vue3，通过页面的按钮事件，在左侧栏目里增加菜单怎么实现？

如下图：

vue3，通过页面的按钮事件，在左侧栏目里增加菜单怎么实现？

现在的思路是通过router.addRoute()方法，添加数据，数据添加成功后，使用router.getRoutes()方法能获取新数据，但是左侧菜单没有显示新数据的菜单项？

问：router.addRoute()能在vue页面使用吗，还是只能在router/index.ts里通过接口的数据动态添加路由？

回答：

改成“新建系统”后，刷新页面，菜单的数据从接口获取了。

回答：

vue"><template>
    <TestMenu :menus="menus"  />
    <div @click="addMenu()">添加</div>
</template>
<script>
import {ref} from "vue";
import TestMenu from './TestMenu.vue'
export default {
    components: {TestMenu},
    setup() {
        const menus = ref([{
            id: 1,
            name: '带单1'
        }, {
            id: 2,
            name: '带单2'
        }]);
        const addMenu = () => {
            menus.value.push({
                id: 3,
                name: '带单3'
            });
        }
        return {menus, addMenu}
    },
}
</script>
<template>
    <div>
        <ul>
            <template v-for="(item, index) in menus" :key="index">
                <li>{{item.name}}</li>
            </template>
        </ul>
    </div>
</template>
<script>
export default {
    props: ['menus']
}
</script>

以上是 vue3，通过页面的按钮事件，在左侧栏目里增加菜单怎么实现？ 的全部内容， 来源链接： utcz.com/p/932952.html

回到顶部