Как загрузить данные API для реагирования компонента, когда обещание будет выполнено? - PullRequest
Новая
       11

Как загрузить данные API для реагирования компонента, когда обещание будет выполнено?

0 голосов
/ 10 июня 2018

Я пытаюсь создать простое приложение, которое вызывает Github API , чтобы получить файл и отобразить этот файл в CodeMirror Компоненте.Код приведен ниже.Однако в настоящее время, хотя я могу записать файл в консоль, я не могу загрузить файл в компоненте CodeMirror.Отображается только [object Promise].

import React from 'react';
import ReactDOM from 'react-dom';
import CodeMirror from 'react-codemirror'
var createReactClass = require('create-react-class');
require('codemirror/lib/codemirror.css');
var axios = require('axios');

var App = createReactClass({
getInitialState: function() {
    return {
        code: getRepos(),

    };
},
updateCode: function(newCode) {
    this.setState({
        code: newCode,
    });
},
render: function() {
    var options = {
        lineNumbers: true,
        styleSelectedText: true,
    };

    return <CodeMirror value={this.state.code.toString()} onChange={this.updateCode} options={options} />
}
});


async function getRepos(){

var code = await axios.get('https://api.github.com/repos/<.java file>',
    {headers: {
            "Accept" : "application/vnd.github.VERSION.raw"
        }
    })
    .then(response => {
        var codeq = response.data;
        return codeq;
    });

    console.log(code);
    return code;

}

ReactDOM.render(<App/>, document.getElementById('root'));

Что я должен сделать, чтобы получить разрешенное обещание для моего компонента CodeMirror ?.
ps Я очень новичок в React.

1 Ответ

0 голосов
/ 10 июня 2018

Кажется, вы не называете это правильно.Вам нужно вызвать getRepos() внутри componentDidMount функцию, подобную этой: 

componentDidMount() {
  getRepos().then((res) => this.setState({code: res}))
}
...