uni-app中scroll-into-view的使用
uni-app中scroll-into-view的使用
在使用的时候需要注意:
需要给sroll-view组件设置宽或者高(根据横纵情况)
white-space:nowrap 这行代码让组件能够滑动(之前自己写的时候踩的坑)
使用scroll-into-view,需要开启动画效果,并且动态绑定的值必须是字符串
并且子组件的上绑定一个id值用于定位
<template>
<view class="scroll-wrapper">
<scroll-view
scroll-x="true"
class="scroll"
enable-flex='true'
scroll-with-animation
:scroll-into-view="'tab'+ tabId">
<view :id="'tab'+index" :class="active == index ? 'active' :''"
v-for="(item,index) in navList"
:key="index"
@click="selectActive(index)">{{item}}</view>
</scroll-view>
</view>
</template>
<script>
export default {
data() {
return {
active:0,
tabId:0
}
},
methods:{
selectActive(index){
this.active = index
this.tabId = index
}
}
}
</script>
总结
以上就是今天要讲的内容，希望对大家有所帮助！！！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之音整理，本文链接：https://www.bmabk.com/index.php/post/82875.html
