vue.js - vux中的scroller,内容过多，translateX的值该怎么动态去改变

问题描述

问 题

1. 问题是，使用vux的scroller，但是里面的块过多，动态改变了width，但是translateX该怎么改变？
   2.相关代码：

<scroller lock-y :scrollbar-x=false :bounce=false>
<div class="box1" id="box1">

<div class="box1-item" v-for="i in item">
    <span>{{' 成员 ' + i + ' '}}</span>
</div>

</div>
</scroller>
其中item:[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18]
var boxwidth = this.item.length;
document.getElementById("box1").style.width = boxwidth*200 + "px";
动态修改该box1的width，但是里面有个transform:translateX(-1114px) translateY(0px) translateZ(0px) scale(1, 1); translateX 的值最大为1114px,当滑动时，该如何动态去改变translateX的值呢？
3.当前情况为，如果我直接将translateX的值设置一下之后，页面将不能滑动。
4.请教大神们帮忙看一下~谢谢大神~

解决方案

在内容变更后，使用reset方法重置宽度。

这篇关于vue.js - vux中的scroller,内容过多，translateX的值该怎么动态去改变的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！