JSFiddle - React, Tailwind, and code Playground
HTML
<script src="//unpkg.com/vue/dist/vue.js"></script>
<script src="//unpkg.com/element-ui/lib/index.js"></script>
<div id="app">
<el-menu :default-active="activeIndex">
<el-menu-item :index="item.id" v-for="(item, index) in menus" :key="item.id">
{{item.label}}
</el-menu-item>
</el-menu>
</div>
CSS
@import url("//unpkg.com/element-ui/lib/theme-default/index.css");
#app .el-menu .el-menu-item.is-active{
background-color: #d1dbe5;
}
JavaScript
var Main = {
data() {
return {
activeIndex: '1',
menus: [{
id: '1',
label: 'aaa'
},{
id: '2',
label: 'bbb'
},{
id: '3',
label: 'ccc'
}]
}
}
}
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')