Блог

В моем приложении у меня есть много служебных функций, которые выполняют небольшие действия, от синтаксического анализа строк до приготовления тостов и так далее. Мой вопрос в том, как мне получить к ним доступ в других .vue файлах? Я не хочу переписывать эти функции для каждого нового компонента Vue, который я пишу. Смогу ли я использовать их, импортируя один компонент в другой? (Vue жалуется, если я не добавляю компонент в шаблон другого, что означает, что я не могу просто импортировать этот JavaScript). Если да, то это хорошая / разумная вещь? Каков стандартный способ сделать это?

Mixins — это концепция, которую вы можете попробовать.

1. импортируйте компонент, который вам нужен.
2. добавьте массив mixin, как показано ниже, в свой компонент прямо над разделом данных (или везде, где это возможно)

   mixins:[yourimportedcomponent], данные:….

3. Вызовите нужный метод, используя this.theMethodYouWant();

Больше вы можете найти здесь https://v2.vuejs.org/v2/guide/mixins.html

Вы могли бы создать плагин, который предоставляет функции Vue . Документация по плагинам

 // group utils functions together 
Vue.prototype.$utils = {
    funcA: function () {  ...  },
    funcB: function () {  ...  }
} 
 

или

Переместите их все в модуль common utilities src/utils.js , затем каждый компонент Vue может импортировать по мере необходимости:

 // src/utils.js
const funcA = () => {
    console.log('funcA');
}

const funcB = () => {
    console.log('funcB');
}

export { funcA, funcB }

// VueComponentA.vue
import { funcA } from 'path/to/utils';

// VueComponentB.vue
import { funcB } from 'path/to/utils';