可拖放文本框允許用戶通過拖動(dòng)備選項(xiàng)至文本框來確定輸入，其實(shí)也可以說是 combobox 的一種變形。 與 combobox 相比，這種組件能讓用戶更加直觀的看到所有備選項(xiàng)，并且可以是多個(gè)輸入共用一組備選項(xiàng)。 類似的組件也曾用在 3D Windrose App，Graph Maker App 等多個(gè) app 里。

注冊(cè)可拖放文本框組件（其實(shí)就是將封裝好的這部分代碼 Ctrl+C and Ctrl+V）。

<script type='text/x-template' id='drag-and-drop-text-box-template'>…</script><script>Vue.component('drag-and-drop-text-box', { template: '#drag-and-drop-text-box-template',…</script>添加組件

直接使用自定義的標(biāo)簽 <drag-and-drop-text-box></drag-and-drop-text-box> 添加可拖放文本框組件。

<drag-and-drop-text-box :columns='columns“ :input='input'></drag-and-drop-text-box>源代碼

Github

以上就是詳解Vue.js 可拖放文本框組件的詳細(xì)內(nèi)容，更多關(guān)于vue 可拖放文本框組件的資料請(qǐng)關(guān)注好吧啦網(wǎng)其它相關(guān)文章！