鍍金池/ 問答/HTML/ cube-ui中<cube-scroll>組件如何實(shí)現(xiàn)滾動(dòng)到選定的結(jié)

cube-ui中<cube-scroll>組件如何實(shí)現(xiàn)滾動(dòng)到選定的結(jié)點(diǎn)

 <cube-scroll :listenScroll="listenScroll"
       :data="items" :options="options" @click="clickMe"     
       :direction="direction" ref="scroll">
 </cube-scroll>

文檔中的click事件參數(shù)已經(jīng)默認(rèn)為節(jié)點(diǎn)的內(nèi)容，而scrollToElement這個(gè)方法需要提高dom元素

回答
編輯回答
念舊

在options里面配置tap:true,它會(huì)在區(qū)域被點(diǎn)擊的時(shí)候派發(fā)一個(gè) tap 事件，你可以像監(jiān)聽原生事件那樣去監(jiān)聽它。然后在vue生命mounted生命周期添加監(jiān)聽

  mounted() {
    this.$refs.scroll.$refs.listWrapper.childNodes[0].addEventListener("tap", (e) => {
      // that.e.srcElement
      this.element = e.srcElement
    })
  },

這樣this.element就是你要點(diǎn)擊的節(jié)點(diǎn)了，在click事件中就可以調(diào)用scrollToElement這個(gè)方法了

 zczc(event) {
    this.$refs.scroll.scrollToElement(this.element, 1000, true, true, "bounce")
 },
2017年2月1日 04:27