uview的u-subsection分段器点击视图不改变 ,change事件可以获取到index 但是视图不改变
可能是因为你没有在change
事件中手动更新视图。你可以在change
事件中获取到当前的index
,然后根据index
来更新视图。
示例代码如下:
<template>
<view>
<u-subsection :list="list" @change="handleChange" />
<view v-for="(item, index) in list" :key="index" v-show="currentIndex === index">
{{ item }}
</view>
</view>
</template>
<script>
export default {
data() {
return {
list: ['选项1', '选项2', '选项3'],
currentIndex: 0,
};
},
methods: {
handleChange(e) {
this.currentIndex = e.detail.index;
},
},
};
</script>
在上面的示例中,我们在change
事件中更新了currentIndex
的值,然后使用v-show
指令来根据currentIndex
来控制当前显示的视图。这样就可以实现点击分段器切换视图的效果了。