uni-app 高性能的左右长列表，tab列表 _列表

前言：笔者一名业余的码农，只是爱好而已。刚从html转到uni-app这边， vue也是第一次写。
效果：
像这个可以左右切换的长列表，上面的tab倒是很好实现，直接使用官方的-view组件就可以了。
但是下方的长列表，要实现并且保证高性能，可不是一件容易事。
下方内容列表一开始，我是考虑使用组件的，但是组件的高度始终是固定的，即便你动态修改了。但依旧是固定的高度，以后内容变化的话，都得重新获取高度。所以排除掉
-view组件的话，官方文档早就说明不适合做长列表了。

文章插图
{{index}}1

{{index}}2

15.content{display: inline-flex;transition-duration:500ms;}.goodsList{width: 750rpx;box-sizing:border-box;padding: 20rpx;}.goodsList .li{display:inline-block;background:#FFF;width:347rpx;margin-bottom: 15rpx;border-radius:14rpx;overflow:hidden;}.goodsList .li:nth-child(even){margin-left: 20rpx;}.goodsList .li .zutu{width:100%;height:347rpx;}.navList{Position:relative;background:#FFFFFF;font-size: 28rpx;width:696rpx;margin:0 27rpx;box-shadow: inset -31rpx 0 31rpx -31rpx rgba(0,0,0,0.15);line-height:66rpx;white-space: nowrap;}.navList .text{padding-left:30rpx;color: #333;}.navList .text:nth-of-type(1){padding-left:0;}.navList .text:nth-last-child(1){padding-right: 19rpx;}.navList .text.active{color:#FF5500;}.navList .line{background: #ff5500;Position: absolute;left: -27rpx;bottom: 4rpx;width:20px;height: 4rpx;}