vue实现瀑布流

1.

import Vue from 'vue'
export default function (el, binding) {
  el.addEventListener('scroll', () => {
    if (el.scrollTop > 0 && Math.round(el.scrollTop + el.offsetHeight) === el.scrollHeight) {
      Vue.prototype.$store.commit('muScroll')
    }
  }, false)
}

　　2.

 

 

Vue.directive('scroll', {
  bind (el) {
    scroll(el)
  },
  unbind () {
    store.commit('unScroll')
  }
})

　　3.

 

 

const state = {
  scroll: 1
}

const getters = {
  getScroll: state => {
    return state.scroll
  }
}

const mutations = {
  muScroll (state) {
    state.scroll ++
  },
  unScroll (state) {
    state.scroll = 1
  }
}

export default {
  state,
  getters,
  mutations
}

　　4.给需要滚动的元素添加v-scroll

　　5.从mapgetter获取页数