自定义指令

minheight.js--------------------------------------------

function resizeHandle (el) {

  const height = document.documentElement.clientHeight

  let header = document.getElementsByClassName('main-header')[0]

  let footer = document.getElementsByClassName('main-footer')[0]

  const footerHeight = footer.offsetHeight

 

  el.style.minHeight = (height - footerHeight) + 'px'

}

 

export default {

  inserted (el, binding) {

    resizeHandle(el)

    window.addEventListener('resize', resizeHandle.bind(this, el), false)

  },

  unbind (el, binding) {

    window.removeEventListener('resize', resizeHandle )

  }

}

 

 

 

 

    <div v-minheight>

 

 

 

 

 

 

 

 

import Vue from 'vue''

import minheight from '../directives/minheight'

Vue.directive('minheight',minheight)