Корпус карты памяти Dynami c + изображение в формате Vue js (облачная база данных Firestore + локальный источник изображений) - PullRequest
Новая
       6

Корпус карты памяти Dynami c + изображение в формате Vue js (облачная база данных Firestore + локальный источник изображений)

0 голосов
/ 04 февраля 2020

Я пытаюсь создать небольшую Vue js страницу (AddItem.vue) с данными ниже. 

  data (){
      dish_name: null,
      dish_description: null,
      dish_type: null,
      dish_image: null
  }

У меня есть форма bootstrap для принятия вышеуказанных данных и вызова insertData() метод, который вызывает метод Firestore Collection.Add(). 

insertData() {
      db.collection("Items")
        .add({
          dish_type: this.dish_type,
          dish_name: this.dish_name,
          dish_description: this.dish_description,
          dish_image: this.dish_image
        })
        .then(docRef => {
          console.log("Client added: ", docRef.id);
        })
        .catch(error => {
          console.error("Error adding dish: ", error);
        });
    }

Я хотел бы скопировать загружаемое изображение из формы в каталог /static/ vue с именем, id, фактическое изображение. Есть ли еще способ сделать это?

Кроме того, я хотел бы перечислить все элементы позже как bootstrap карты с данными карты из магазина и изображение карты из папки vue / stati c.

Is Ax ios JS - правильный способ PUT и GET файлов изображений из папки static в Vue?

Есть ли другой лучший способ сделать это ?

Спасибо,

Рахул

1 Ответ

0 голосов
/ 18 февраля 2020

Благодаря Brad Traversy & Academind я использовал ax ios для размещения и получения изображений с внутреннего сервера узла (express js).

Второй подход заключается в хранении обоих данных + изображения в пожарной части Firebase. Я не был уверен в производительности второго подхода и поэтому хотел хранить изображения на самом сервере.

Я не мог различить разницу во времени между двумя подходами. Чтобы завершить свой проект, я решил сохранить данные + изображение в firestore и получить доступ через API Firestore.

Более подробную информацию о firestore можно найти здесь - https://firebase.google.com/docs/firestore/quickstart

...