import Vue from 'vue' //图片裁剪vue指令 Vue.directive('load', function(el, binding) { let imgDom = document.createElement('img') imgDom.style.position = 'absolute' imgDom.style.top = '-999px' imgDom.style.opacity = 0 imgDom.src = el.src el.src = '' imgDom.onload = () => { let width = imgDom.width let height = imgDom.height if (width > height) { el.style.height = '100%' el.style.width = 'auto' el.style.position = 'absolute' el.style.left = '50%' el.style.top = '0' el.style.transform = 'translateX(-50%)' el.style.webkitTransform = "translateX(-50%) translateY(0)"; el.style.MozTransform = "translateX(-50%) translateY(0)"; el.style.msTransform = "translateX(-50%) translateY(0)"; el.style.OTransform = "translateX(-50%) translateY(0)"; } else if (width < height) { el.src = imgDom.src el.style.width = '100%' el.style.height = 'auto' el.style.position = 'absolute' el.style.top = '50%' el.style.left = '0' el.style.transform = 'translateY(-50%) translateX(0)' el.style.webkitTransform = "translateY(-50%) translateX(0)"; el.style.MozTransform = "translateY(-50%) translateX(0)"; el.style.msTransform = "translateY(-50%) translateX(0)"; el.style.OTransform = "translateY(-50%) translateX(0)"; } else { el.style.width = '100%' el.style.height = '100%' el.style.position = 'absolute' el.style.top = '0' el.style.left = '0' el.style.transform = 'translateY(0) translateX(0)' el.style.webkitTransform = "translateY(0) translateX(0)"; el.style.MozTransform = "translateY(0) translateX(0)"; el.style.msTransform = "translateY(0) translateX(0)"; el.style.OTransform = "translateY(0) translateX(0)"; } // if (el.alt == '视频资料' || el.alt == '视频') { // el.style.width = '52px' // el.style.height = '42px' // el.style.display = 'block' // el.style.margin = 'auto' // el.style.marginTop = '60px' // el.style.position = 'initial' // el.style.top = '0' // el.style.left = '0' // el.style.transform = 'translateY(0) translateX(0)' // el.style.webkitTransform = "translateY(0) translateX(0)"; // el.style.MozTransform = "translateY(0) translateX(0)"; // el.style.msTransform = "translateY(0) translateX(0)"; // el.style.OTransform = "translateY(0) translateX(0)"; // } el.src = imgDom.src } }) //点击空白处隐藏div指令 Vue.directive('clickOutside', { // 初始化指令 bind(el, binding, vnode) { function documentHandler(e) { // 这里判断点击的元素是否是本身,是本身,则返回 if (el.contains(e.target)) { return false; } // 判断指令中是否绑定了函数 if (binding.expression) { // 如果绑定了函数 则调用那个函数,此处binding.value就是handleClose方法 binding.value(e); } } // 给当前元素绑定个私有变量,方便在unbind中可以解除事件监听 el.__vueClickOutside__ = documentHandler; document.addEventListener('click', documentHandler); }, update() {}, unbind(el, binding) { // 解除事件监听 document.removeEventListener('click', el.__vueClickOutside__); delete el.__vueClickOutside__; }, })