在Vue中，有時候我們需要在圖片或者其他元素懶加載時使用lazy技術，這時候我們可以使用Vue自定義的lazy指令來實現。

首先，在Vue實例中定義一個全局的自定義指令：

Vue.directive('lazy', {
inserted: function (el, binding) {
let lazyImage = new Image();
lazyImage.src = binding.value;
lazyImage.onload = function() {
el.src = binding.value;
el.classList.add('loaded');
};
}
})

上述指令中，lazy指令接收一個綁定值，該值是用于替換占位符圖片的真實圖片的地址。

然后，在需要使用懶加載的元素上使用v-lazy指令，如下所示：

<img v-lazy="imageSrc" alt="">

注意，要在圖片元素上添加一個loaded類，來標識圖片已經加載完畢，以便我們可以進行樣式上的操作。

最后，我們需要使用CSS來控制占位符和真實圖片之間的過渡效果。這里提供一種簡單的示例：

img {
opacity: 0;
transition: all 0.3s ease-in;
}
img.loaded {
opacity: 1;
}

上述樣式中，我們設置了一個img元素在加載之前是不可見的（透明度為0），并且在加載完成后通過.loaded類來控制它的透明度變為1，以實現過渡效果。

以上就是Vue自定義lazy指令的簡單實現方法，使用起來非常簡便，能夠有效提升網頁加載的效率。