<template>
<div style="width: 100%">
<div class="aaa" style="width: 100%;overflow-x: auto;" >
<div style="display: flex">
<div v-for="(item,index) in 10" :key="index">
<div @click="active = index"
:class="active == index?'ccc':'bbb'"
style="height: 50px;width: 100px;line-height: 50px;margin: 0 10px;text-align: center">
{{ index }}
</div>
<div v-if="active === index" style="height: 2px;background-color: #000000;margin: 0 10px;"></div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
name: "index",
data(){
return{
active: 0
}
}
}
</script>
<style scoped>
.aaa::-webkit-scrollbar {
display: none !important;
}
.bbb{
background-color: red;color: #000;
}
.ccc{
background-color: yellow;color: #000;
}
</style>
复制即可
