.el-menu-item.is-active如何只给没有子元素的菜单

在HTML和CSS中，`.el-menu-item.is-active` 是Eleme UI（Element UI）中的一个类名，用于标识当前选中的导航菜单项。如果你想仅给那些没有子元素的菜单项添加这个样式，你可以这样做：

1. 首先，在CSS中，你可以为`.el-menu-item`设置默认样式，并在`.el-menu-item.is-active`中添加激活状态下的样式。例如：

.el-menu-item {
  /* 默认样式 */
}

.el-menu-item.is-active {
  /* 激活状态样式，如背景颜色、边框等 */
}

2. 然后，在JavaScript或Vue.js中，检查每个`.el-menu-item`是否有子元素，如果没有则应用`.is-active`类。假设你正在使用Vue.js：

<template>
  <div ref="menuItems"></div>
</template>

<script>
export default {
  mounted() {
    this.$refs.menuItems.forEach(item => {
      if (!item.children) { // 如果没有子元素
        item.classList.add('is-active');
      }
    });
  },
};
</script>

这里使用了 Vue 的 `ref` 和 `forEach` 来遍历菜单项并判断是否需要添加 `.is-active` 类。