在el-menu中加上router参数，同时el-menu-item 中index直接写上链接地址，default-active="/home" 设置默认选中状态

源代码如下：

<el-menu default-active="/home" router>
                        <el-menu-item index="/home"><a href="javascript:;"><i class="iconfont icon-shouyeshouye"></i>首页</a></el-menu-item>
                        <el-menu-item index="/activity"><a href="javascript:;"><i class="iconfont icon-gongju"></i>活动管理</a></el-menu-item>
                        <el-menu-item index="/selfgoodsinfo"><a href="javascript:;"><i class="iconfont icon-shangpinguanli"></i>奖品管理</a></el-menu-item>
                        <el-menu-item index="/order"><a href="javascript:;"><i class="iconfont icon-dingdanguanli"></i>订单管理</a></el-menu-item>
                        <el-menu-item index="/report"><a href="javascript:;"><i class="iconfont icon-report"></i>报表统计</a></el-menu-item>
                    </el-menu>

编译后的代码如下：

在el-menu-item生成li之后会在li上面自动添加 style="padding-left: 20px;" 针对 el-menu-item样式写 padding:0 !important; 这样就可以去除20px

Logo
Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^

avatar Vue
cover

echarts堆叠柱状图

avatar Vue

Error in v-on handler: "TypeError: Cannot read properties of undefined (reading 'current')"

这是一个 Vue.js 错误，报错信息提示在 v-on 处理程序中出现了错误：“TypeError: Cannot read properties of undefined(读取 'current')”。这意味示在您的代码中，试图读取一个未定义的变量 'current'。您需要检查您的代码，确保 'current' 已正确定义并初始化。...

avatar Vue