Global filters of Vue

I wrote the logic of the global filter in the entry js of Vue. I read that the official case is the globally registered function of Vue.filter (). I want to write it in a different way, using mixins

.

this way I tried to put the filter function in mixins on a single component page, but it didn"t work in the entry file. Why is that? Isn"t global blending accessible on every page?

main.js

const mixins = {    
    filters: {             
        mixin_fixed2 (val) {            
            return val.toFixed(2);   
        }
    },
    created(){
        console.log("chengg")
    }   
}

new Vue({
  el: "-sharpapp",
  router,
  mixins:[mixins],
  template: "<App/>",
  components: { App }
})

in this way, I reported an error when I used this mixin_fixed2 filter on other component pages.

I put this logic on a single component page

import mixins from "@/plugins/mixins.js"

export default {
  mixins:[mixins]
}

here is no problem

Mar.15,2022

mixins only works on the current component, that is, you inject mixins into the root component. Only the root component can call the injected filters , and will not infiltrate the subordinate component

.

you can try global Vue.mixin ()

I don't recommend doing this. You should let the right method do the right thing. It's not easy to worry about looking back at the code with filter in the future. However, if you mix this with mixin , if you want to check a filter , you have to think about whether you are defined in mixin , which is very irregular

.
Menu