TommyD
TommyD

Reputation: 1043

Vue - global import

I use

import {mapFields} from "vuex-map-fields"

in every component.

How can I make this available in every component without having to import it? Is there any risk to this?

Upvotes: 5

Views: 12559

Answers (2)

Stephen Won
Stephen Won

Reputation: 49

you can use Vue.prototype as follows..

[src/main.js]

import { mapFields } from 'vuex-map-fields';
...
Vue.prototype.$mapFields = mapFields; 

then in any component you can use this.$mapFields(...) function!

[ in any component ]

<template>
......
</template>

<script>
export default {
  computed: {
    ...this.$mapFields({
      userFirstName: 'user.firstName',
      userLastName: 'user.lastName',
    }),
  },
};
</script>

There is no risks in this code...

Upvotes: 4

Marcogomesr
Marcogomesr

Reputation: 2672

if you want it globally what you have to do it's inject in the Vue instance same way that we do when we use vuex

main.js

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

new Vue( {
  el: '#app',
  store,
  render: h => h( App )
} );

then in any component you can console.log(this); you should be able to see your object

Upvotes: 4

Related Questions