React Redux简单的GET Api呼叫

时间:2018-06-04 03:11:34

标签: django reactjs redux django-rest-framework

我有一个反应应用程序,它将使用redux来存储某些全局状态信息,例如Django Rest Framework的用户身份验证令牌,以及当前页面上的信息。但我很难弄清楚如何开始它。

目前我有需要连接到redux的组件,当它安装时,它会调用API来获取信息......

componentDidMount() {
    axios
        .get("http://localhost:8000/api/spells/1")
        .then(response => {
            console.log('[API]:\t', response);
            let fields = response.data;
            let spell = Object.assign({}, this.state.spell);

            spell.Name =  fields.Name;
            spell.School =  fields.School;
            spell.Subschool =  fields.Subschool;
            this.setState({
                spell
            });
        })
        .catch(function(error) {
            console.error('[API]\t', error);
        });
}

我对应该在哪里调用API以及我应该如何操作更加困惑。我在线阅读的所有教程都没有多大帮助,他们都使用相同的例子。

那么我应该如何通过API使用actions / reducers / etc加载模型的信息?这样它就会更新具有基本形式的redux商店

{
    other: info,
    spell: {
        Name: 'sdfs',
        School: 'sdfs',
        Subschool: 'sdfs',
    }
}

编辑:作为参考,this是我主要关注的教程。我有auth工作和所有,我只是无法弄清楚如何使它适应DRF中的各种其他端点。

1 个答案:

答案 0 :(得分:0)

ComponentDidMount()
安装组件后立即调用

componentDidMount()。需要DOM节点的初始化应该放在这里。如果需要从远程端点加载数据,这是实例化网络请求的好地方。

here