vue中的头部点击切换
HTML:
<ul class="HeadTheList">
<li v-for="item in atu" :key="item._id">
{{ item.title }}
</li>
</ul>
style:
.HeadTheList {
width: 100%;
height: 45px;
line-height: 45px;
background: #fff;
display: flex;
flex-wrap: nowrap; // 不换行
overflow: scroll; //超出出现滚动条
li {
margin-left: 20px;
white-space: nowrap;
// display: block;
}
// text-overflow: ellipsis; 多行文本时,溢出出现省略号
script:
function clicks(id,index) {
state.active = index;
// console.log(state.active);
// 获取_id
state.uid = id;
}