uni-app中scroll-into-view的使用
uni-app中scroll-into-view的使用
在使用的时候需要注意:
需要给sroll-view组件设置宽或者高(根据横纵情况)
white-space:nowrap 这行代码让组件能够滑动(之前自己写的时候踩的坑)
使用scroll-into-view,需要开启动画效果,并且动态绑定的值必须是字符串
并且子组件的上绑定一个id值用于定位
文章来源：https://www.toymoban.com/news/detail-504562.html
<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.toymoban.com/news/detail-504562.html
到了这里，关于【uni-app】uni-app中scroll-into-view的使用的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
