vue局部和全局自定义过滤器和自定义指令的方法

如下是一个vue页面:





如下是全局定义,main.js中

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'

Vue.config.productionTip = false

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app')
//这里自定义的指令都是全局指令
// 定义全局的指令  v-focus
// 和样式相关的操作,一般都可以在 bind 中执行
// 和JS行为有关的操作,最好在 inserted 中去执行
Vue.directive("focus", {
  bind: function (el) {

  },
  inserted: function (el) {
    el.focus()
  },
  updated: function (el) {

  }
})
// 自定义一个颜色指令
Vue.directive("bg-color", {
  bind: function (el) {
    el.style.background = "red"
  },
  inserted: function (el) {

  },
  updated: function (el) {

  }
})
// 自定义一个颜色指令,可以传参的那种
Vue.directive("paramsColor", {
  bind: function (el, binding) {
    // el.style.background = "red"
    el.style.color = binding.value
    el.style.fontWeight = binding.value
  },
  inserted: function (el) {

  },
  updated: function (el) {

  }
})

你可能感兴趣的:(vue)