vue 横向菜单滚动定位_使用vue组件+iscroll实现一个横向菜单，不能正确滑动

使用vue组件+iscroll实现一个横向菜单，可是却不能滑动，给父元素ul写死一个宽度可以滑动。

但是，我在computed里计算宽度，直接路由进去不能滑动，当我进入别的组件(切换路由)回来又可以滑动了

示例地址：http://onepoint.stg4.v5time.net/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)

}

}

}