使用vue组件+iscroll实现一个横向菜单，可是却不能滑动，给父元素ul写死一个宽度可以滑动。
但是，我在computed里计算宽度，直接路由进去不能滑动，当我进入别的组件(切换路由)回来又可以滑动了
示例地址：http://onepoint./news/1
{{item.name}}
#wrapper{
position: absolute;
z-index: 1;
height: 40px;
left: 0;
width: 100%;
overflow: hidden;
}
#scroller{
position: absolute;
z-index: 1;
-webkit-tap-highlight-color: rgba(0,0,0,0);
}
#scroller ul{
width: 100%;
height: 100%;
text-align: center;
}
#scroller li{
float:left;
height: 30px;
line-height: 30px;
width:1.6rem;
list-style-type: none;
}
#scroller .bot{
border-bottom:2px solid rgb(37, 190, 169);
}
import IScroll from 'iscroll/build/iscroll-lite.js'
export default{
props: {
menu: {
type: Array
},
selected: {
type: Boolean,
require: false,
default: false
}
},
data () {
return {
index: 0
}
},
computed: {
getWidth () {
return 'width:' + this.menu.length * 1.6 + 'rem'
}
},
ready () {
var myScroll = new IScroll(this.$els.wrapper, {scrollX: true, scrollY: false})
myScroll.say = ''
},
methods: {
checkIt (index, item) {
var lis = this.$els.ul.children
lis[this.index].classList.remove('bot')
this.index = index
lis[index].classList.add('bot')
this.$dispatch('click-msg', item)
}
}
}
