vue.js - vue. directive需要怎么写成ES6

问题描述

问 题

Vue.directive('select', {
  twoWay: true,
  priority: 1000,

  params: ['options'],
    
  bind: function () {
    var self = this
    $(this.el)
      .select2()
      .on('change', function () {
        self.set(this.value)
      })
  },
  update: function (value) {
    $(this.el).val(value).trigger('change')
  },
  unbind: function () {
    $(this.el).off().select2('destroy')
  }
})

var vm = new Vue({
  el: '#el',
  data: {
    selected: 0,
    options: [
      { id: 1, text: 'hello' },
      { id: 2, text: 'what' }
    ]
  }
})

这段代码在

export default{}

里需要怎么写？

解决方案

取决于你想怎么用，可以不用export，使用时直接注册

import 'path/to/my-directive'

或者将它的定义单独export：

export default {
    name: 'my-directive',
    params: [],
    bind: function () {},
    update: function () {}
    ...
}

使用时：

import MyDirective from 'path/to/my-directive'
Vue.directive(MyDirective.name, MyDirective);

这篇关于vue.js - vue. directive需要怎么写成ES6的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！