Как вернуть значение из функции в реагировать родной

Question

Эта функция возвращает данные токена из используемого мной API.

// api.js
var token="";
    const tokenAl= {
  tokenner: function(){
    fetch("myurl/api/token", {
      method: "POST",
      headers: {
        Accept: "application/json",
        "Content-Type": "application/json-patch+json"
      },
      body: JSON.stringify({
        // here is not important
      })
    })
      .then(response => response.json())
      .then(responseJson => {
       token= responseJson.result.token;
        console.warn(token) // it's ok. I got the token.
      })
      .catch(error => console.warn(error));    
       // this.props.navigation.navigate("Customer"); // Customer sayfasına gidiş.
  },
}

export default tokenner;

Все хорошо. Теперь, как мне использовать это значение токена в файле Login-Form.js?

Answer 1

Прежде всего, это export default tokenAl.tokenner.

Чтобы использовать его в другом файле, просто добавьте его вверху формы Login-Form.js

import tokenner from './api.js'; //assuming it's located in the same directory

Вам необходимо изменить функцию токена, чтобы можно было получить токен. Верните обещание.

tokenner: function(){
    return fetch("myurl/api/token", {
      method: "POST",
      headers: {
        Accept: "application/json",
        "Content-Type": "application/json-patch+json"
      },
      body: JSON.stringify({
        // here is not important
      })
    })
      .then(response => response.json());
  }

Тогда в вашем LoginFormComponent

import React, { Component } from "react";
import tokenner from "./api";

export default class LoginFormComponent extends Component {
  constructor() {
    super();
    this.state = { token: null };
  }

  componentWillMount() {
    tokenner()
      .then(responseJson => {
        const token = responseJson.result.token;
        console.warn(token); // it's ok. I got the token.
        this.setState({ token });
      })
      .catch(error => console.warn(error));
  }
  render() {
    const { token } = this.state;
    return <div>{token}</div>;
  }
}

Рабочий пример здесь