#vuejs3
#vuejs3
Вопрос:
В приложении vuejs3 я пытаюсь использовать метод настройки в mixins, как я использовал в vuejs2 мой src/appMixin.js иметь:
import moment from 'moment-timezone'
import { settingsAwesomeFontLabels } from './app.settings.js'
export default {
methods: {
getClone: function (obj) {
let copy = JSON.parse(JSON.stringify(obj))
return copy
},
}
}
и в моем файле vue :
import appMixin from '@/appMixin'
import app from './../../App.vue' // eslint-disable-line
import axios from 'axios' // eslint-disable-line
// ...
setup () {
function loadCategories() {
isPageLoaded = false
let credentials = getClone(credentialsConfig)
credentials.headers.Authorization = 'Bearer ' currentLoggedUserToken.value
// ...
С помощью метода getClone я хочу получить credentialsConfig из settings.js файл
и измените заголовки с помощью токена текущего входа в систему.
Но в консоли, где я запускаю команду
$ yarn run serve
Я вижу ошибку :
/mnt/_work_sdb8/wwwroot/lar/VApps/yt3/src/admin/categories/list.vue
234:27 error 'getClone' is not defined no-undef
и ошибка в консоли браузера:
list.vue?c790:233 Uncaught (in promise) ReferenceError: getClone is not defined
Я полагаю, из-за ошибки в консоли
Какой правильный способ экспортировать / импортировать getClone в метод установки?
Спасибо!
Ответ №1:
Вы могли бы реорганизовать это, чтобы использовать a composition function
вместо mixin. Например, ваша getClone
функция будет находиться в файле useGetClone.js
:
export default function (obj) {
return JSON.parse(JSON.stringify(obj));
}
Затем в любом компоненте, который вы хотите использовать:
import getClone from `@/composables/useGetClone`;
export default {
setup() {
// …
const getClone = useGetClone(credentials);
// …
return {};
},
};
Комментарии:
1. В моем mixin есть много методов. Я полагаю, что я могу поместить все методы в 1 js-файл с объявлениями функций экспорта по умолчанию. Должен ли я писать import methodName в любое время, когда мне нужно использовать methodName? mixin нельзя использовать с vuejs3?
2. Если все логически связано
getClone
, то ничто не мешает вам экспортировать объект, содержащий все связанные функции, т.Е.export default { funcOne() {}, funcTwo() {} };
3. @mstdmstd Мэтт прав, пожалуйста, прочитайте последнюю строку здесь