Как сделать отдельную функцию в реакции, которая выбирает данные и вызывает каждый раз, когда это необходимо - PullRequest
Новая
       4

Как сделать отдельную функцию в реакции, которая выбирает данные и вызывает каждый раз, когда это необходимо

0 голосов
/ 18 марта 2020

Я хочу сделать функцию в реакции, которая будет вызываться для каждого компонента, для которого нужны данные. Я попробовал это, кстати, но он возвращает тип Promise, а не данные, которые мне нужны. Вместо этого, если я делаю console.log (res.data.user), он приносит данные. Почему я не могу вернуться и иметь его готовым для реализации в каждом компоненте, который мне нужен? 

import React, { Component } from 'react';
import { useQuery } from "@apollo/react-hooks";
import query from './queries/CurrentUser';
import receive_client from "./Client";

const CurrentUserQuery = async function () {
    const client = receive_client()
    const result = await client.query({ query: query }).then((res) => {
      return res.data.user
    })
}

export default CurrentUserQuery;

и здесь я называю это 

import React, { Component } from 'react';
import CurrentUser from '../../CurrentUserQuery'

class Home extends Component {

  render(){

    console.log(CurrentUser())

    return(
      <div></div>
    )
  }
}

Ответы [ 2 ]

0 голосов
/ 19 марта 2020

Объект Promise представляет возможное завершение (или сбой) асинхронной операции и ее результирующее значение.

В функции CurrentUserQuery следует использовать либо await, либо then() . 

const CurrentUserQuery = async function () {
  try{
    const client = receive_client()
    const response = await client.query({ query: query })
    return {success: true, user:response.data.user}
  }catch (err){
    return {success: false}
  }
}

export default CurrentUserQuery;

/* CurrentUser function return a promise. To get the resolved 
   value you have to pass a callback to 'then()' 
   which will be executed the callback once the promise is resolved.
*/
class Home extends Component {

  componentDidMount(){
    CurrentUser().then(({user, success}) => {
      if(success)this.setState({user})
    })
  }
   //.... Rest Of Code .....  
}
0 голосов
/ 18 марта 2020

Похоже, вы не возвращаетесь из функции CurrentUserQuery, 

const CurrentUserQuery = async function () {
    const client = receive_client()
    const result = await client.query({ query: query }).then((res) => {
      return res.data.user
    })
    if(result){
        return result
    }
}
...