element框架里面el-menu-item选中颜色延迟显示

<el-menu
          :default-active="activeIndex"
          class="el-menu-demo"
          mode="horizontal"
          @select="handleSelect"
          lazy
        >
          <el-menu-item index="1">
            <i class="fa fa-linode" aria-hidden="true"></i>
            项目投资
          </el-menu-item>
          <el-menu-item index="2">
            <i class="fa fa-linode" aria-hidden="true"></i>
            项目合同
          </el-menu-item>
................................
        </el-menu>

点击标签时候选中颜色不显示或者延迟显示
解决：

.el-menu-item::before {
content: “”;
position: absolute;
right: 10px;
top: 50%;
width: 5px;
height: 5px;
transform: translateY(-50%) rotate(45deg);
background-color: #409eff;
visibility: hidden;
opacity: 0;
transition: all 0.3s;
}
/* .el-menu-item:hover::before {
visibility: visible;
opacity: 1;
} */
.el-menu-item.is-active {
color: #409eff !important;
background-color: #f5f7fa !important;
}
.el-menu-item.is-active::before {
background-color: #409EFF;
visibility: visible;
opacity: 1;
}

切换tab的时候颜色可以正常显示！！！