Перевод Axe ios методов для получения - PullRequest
Новая
       36

Перевод Axe ios методов для получения

0 голосов
/ 29 января 2020

У меня проблемы с поиском способа перевода приведенных ниже методов, написанных с помощью Ax ios, для получения. 

import axios from 'axios';

const url = 'http://localhost:5000/api/posts/';

URL-адрес запускается с порта 5000 с моего сервера с использованием 'npm run dev' 

class PostService {

//Get Posts
static getPosts() {
    return new Promise(async (resolve, reject) => {
        try {
            const res = await axios.get(url);
            const data = res.data;
            resolve(
                data.map(post => ({
                    ...post,
                    createdAt: new Date(post.createdAt)
                }))
            );
        } catch (err) {
            reject(err);
        }
    })
}

Выше показано использование обещания и топора ios для сопоставления data 

//Create Posts
static insertPost(text, topic, price, location, provider, review) {
    return axios.post(url, {
        text,
        topic,
        price,
        location,
        provider,
        review
    });
}

Вышеприведенный пример возвращает данные с использованием ax ios 

//Delete Posts
static deletePost(id) {
    return axios.delete(`${url}${id}`);
}

}

Вышесказанное находит идентификатор записи в БД и использует ax ios для ее удаления. 

export default PostService;

Ответы [ 2 ]

0 голосов
/ 29 января 2020

Fetch очень похож на ax ios, поэтому переход не так уж отличается:

Общий подход с ответом JSON: 

  try {
    const url = 'http://localhost:5000/api/posts/';
    const response = await fetch(url);
    const jsonData = await response.json();

    console.log(jsonData); // Do whatever you want with the JSON response...
  } catch (error) {
    console.error(error)
  }

Если бы мы подали заявку на вашу функцию, должно быть что-то вроде этого: 

//Get Posts
static getPosts() {
    return new Promise(async (resolve, reject) => {
        try {
             const url = 'http://localhost:5000/api/posts/';
             const response = await fetch(url);
             const data = await response.json();

             resolve(
                data.map(post => ({
                    ...post,
                    createdAt: new Date(post.createdAt)
                }))
            );
        } catch (err) {
            reject(err);
        }
    })
}

А теперь для поста: 

//Create Posts
static insertPost(text, topic, price, location, provider, review) {

    const formData = new FormData()
    formData.append('text', text);
    formData.append('price', price);
    formData.append('location', location);
    formData.append('provider', provider);
    formData.append('review', review);

    try {
        const response = await fetch(url, { method: 'POST', body: formData });
        const jsonResponse = await response.json();

        return jsonResponse;
    } catch (error) {
        console.error(error)
    }
}

И для удаления 

//Delete Posts
static deletePost(id) {
    return fetch(`${url}${id}, {method: "DELETE" });
}
0 голосов
/ 29 января 2020

обо всем по порядку! Что это за первая мерзость?

с Обещаниями 

static getPosts() {
  const turnCreatedAtToDate = post => ({
    ...post,
    createdAt: new Date(post.createdAt)
  });

  return axios.get(url)
              .then(data => data.map(turnCreatedAtToDate));
}

или с полной асинхронностью c

static async getPosts() {
  const data = await axios.get(url);
  return data.map(post => ({
    ...post,
    createdAt: new Date(post.createdAt)
  }));
}

Но не собирайте все доступные паттерны, положите их в миске яростно перемешайте и налейте это затем в функцию.

Вернуться к началу c

извлечение немного более многословно: 

class PostService {
  //Get Posts
  static async getPosts() {
    const response = await fetch(url);
    const data = await response.json();

    return data.map(post => ({
      ...post,
      createdAt: new Date(post.createdAt)
    }));
  }

  //Create Posts
  static insertPost(text, topic, price, location, provider, review) {
    return fetch(url, {
      method: "POST",
      headers: {
        "Content-Type": "application/json"
      },
      body: JSON.stringify(text,
        topic,
        price,
        location,
        provider,
        review
      })
    );
  }

  //Delete Posts
  static deletePost(id) {
    return fetch(`${url}${id}`, {
      method: "DELETE"
    });
  }
}
...