如何在侧栏element.io vue中使用打开和关闭方法

时间:2018-09-27 22:06:54

标签: vue.js vue-component

我在我的应用程序中使用vue的element.eleme.io,所以有一个NavMenu组件,我想在另一个菜单打开时关闭子菜单,该组件有一个close方法可以关闭特定的子菜单,但是我不知道如何使用。

这是我的代码

<el-menu
        background-color="transparent"
        @open="handleOpen"
        @close="handleClose"
        @select="subMenuSeleccionado"
        :default-active="activo">
        <el-submenu :index="categoria.slug" v-for="(categoria,indexCategoria) in categoriasOrdenadas"
                    :key="indexCategoria">
            <template slot="title">
                <i class="el-icon-setting"></i> <span>{{categoria.nombre}}</span>
            </template>
            <el-menu-item-group v-for="(subcategoria, indexSubcategoria) in categoria.categoriasHijas"
                                :key="subcategoria.slug">
                <el-menu-item :index="subcategoria.slug">{{subcategoria.nombre}}</el-menu-item>
            </el-menu-item-group>

        </el-submenu>
    </el-menu>

在handleOpen函数中,我尝试了类似的方法,但是它不起作用

 methods: {
        handleOpen(key) {
            this.$el.close('key1');
        },

这是页面 https://element.eleme.io/#/en-US/component/menu

1 个答案:

答案 0 :(得分:1)

在文档中说菜单接受一个名为unique-opened的道具,该道具用于检查一次是否只能激活一个子菜单,默认情况下它设置为false < br />
您可以像这样将其作为真实值传递:

<el-menu :unique-opened="true" ...