Блог

Главная - Вопросы по программированию - Вызов функции JS из другого файла в компоненте VueJS

Вызов функции JS из другого файла в компоненте VueJS

#javascript #vue.js #vuejs2

Вопрос:

Я начинаю кое-что делать в Vue.Js. У меня есть localStorage.js файл добавлен в мой html, и с самим файлом проблем нет. Если я использую консоль браузера, я могу вызывать функции внутри нее, независимо от того, какой компонент загружен в представлении маршрутизатора. Мне нужно отобразить список элементов в компоненте, используя данные, которые возвращает функция внутри моего файла js, но я не могу заставить его работать. Как я могу использовать ответ от указанной функции в качестве данных в своем компоненте, чтобы я мог перебирать его с помощью v-for? Функция возвращает массив объектов. Я попытался настроить компонент следующим образом:

 export default {
    name: 'lista',
    components: {
        codiceLista
     },
     data(){
       return readLocalStorage()
     }

С функцией readLocalStorage, являющейся функцией в моем внешнем файле, но в ней говорится, что она не определена. Буду признателен за любую помощь. Спасибо

Ответ №1:

просто импортируйте его:

 import { readLocalStorage } from 'external/file/location'; // <- here

export default {
    name: 'lista',
    components: {
        codiceLista
     },
     data(){
       return readLocalStorage()
     },
...
}

Комментарии:

1. Спасибо за помощь. Я попробовал это, но это не говорит мне, что функция больше не определена, но теперь это говорит мне, что data() не является функцией, даже если она структурирована, как вы написали. (Сейчас он компилируется, но это ошибка во время выполнения). Должен ли я добавить экспорт перед объявлением функции в файле js?

2. Это недопустимый синтаксис. Вы можете добавить его в свойство внутри данных, но не возвращать функцию, как вы это сделали. data() { return { myFunc: readLocalStorage }}

Метки: