在項目開發過程中，難免會遇到各種功能需要使用Vue自定義指令--directive 去實現 。關於directive的使用方式這里就不做過多的介紹了，Vue官方文檔中說的還是聽明白的。今天講講在使用Vue自定義指令過程中
1. 怎么數據傳遞到自定義指令中
2.怎么講自定義指令中的數據傳回到組件實例中
一、將數據傳遞到自定義指令中
<li class="table-columns" v-for="(tableHead,
index) in getTableHeadList" :class="{'column-active':tableHeadIndex === index}" :key="index" :style="{width:tableHead.fieldWidth + 'px' }">
<div class="app-shrink-drag" v-dragWidth="
index"></div>
</li>
這里只是傳遞了一個元素的索引進去，index 可以是其他類型的值 ，比如json對象
{index:1}
在指令中 通過binding.value 或者 binding.value.index 接收。
inserted(el,
binding, vnode) {
二、講自定義指令中的數據傳遞到組件實例中
自定義指令可以接收三個參數
el：指令所綁定的元素，可以用來直接操作 DOM。binding：一個對象，包含以下屬性：name：指令名，不包括v-前綴。value：指令的綁定值，例如：v-my-directive="1 + 1"中，綁定值為2。oldValue：指令綁定的前一個值，僅在update和componentUpdated鈎子中可用。無論值是否改變都可用。expression：字符串形式的指令表達式。例如v-my-directive="1 + 1"中，表達式為"1 + 1"。arg：傳給指令的參數，可選。例如v-my-directive:foo中，參數為"foo"。modifiers：一個包含修飾符的對象。例如：v-my-directive.foo.bar中，修飾符對象為{ foo: true, bar: true }。
vnode：Vue 編譯生成的虛擬節點。
Vue 編譯生成的虛擬節點包含當前組件實例對象（vnode.context），可以將自定義指令中修改過的數據，直接賦值實例中的對象屬性 列如：
vnode.context.arr[index].name = 'xxx'。
目前只了解到可以這種方式 實現自定義指令和組件實例的相互傳值，如果大神們還知道其他方式，歡迎留言。