除了核心功能默認內置的指令 (v-model 和 v-show等)，Vue 也允許註冊自定義指令。
1.例子一：
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
</style>
</head>
<body>
<div id="app">
<p>向下滾動頁面</p>
<p v-tack="200">我固定在距離頁面頂部200px的地方</p>
</div>
<script src="js/vue.min.js"></script>
<script>
// 創建自定義指令
Vue.directive('tack',{
bind(el,binding,vnode){
el.style.position = 'fixed'
el.style.top = binding.value + 'px'
console.log(el)
}
})
var app = new Vue({
el:"#app",
methods:{
}
});
</script>
</body>
</html>
2.例子二（指令傳參）
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
</style>
</head>
<body>
<div id="app">
<p>向下滾動頁面</p>
<p v-tack="{top:'100',left:'400'}">Demo02</p>
</div>
<script src="js/vue.min.js"></script>
<script>
// 創建自定義指令
Vue.directive('tack',{
bind(el,binding,vnode){
el.style.position = 'fixed'
// const s =(binding.arg === 'left'?'left':top)
el.style.top = binding.value.top + 'px'
el.style.left = binding.value.left + 'px'
console.log(el)
}
})
var app = new Vue({
el:"#app",
methods:{
}
});
</script>
</body>
</html>