this.setState不是函数吗？

Question

该代码由两步API实现组成：首先是获取令牌的功能，然后是获取所需数据的功能（使用令牌作为auth）。

我已经定义了两个函数，并尝试在init中调用它们。

使用var而不是state来移动函数，将函数嵌套在彼此内部。但是随后我遇到了异步问题，即在页面加载之前，第二个函数不会执行，此时变量值设置为undefined。

import PLUGIN_NAME = 'Foo';

export default class Foo extends bar
{
    constructor(PLUGIN_NAME)
    {
        super(PLUGIN_NAME);
        this.state = 
        {
            token: "",
            cid: "",
        };
        this.fetchToken = this.fetchToken.bind(this);
        this.fetchCustomer = this.fetchCustomer.bind(this);
    }

    fetchToken(options, token)
    {   var http = require("https");
        var req = http.request(options, function (res)
        {
            var chunks = [];
            res.on("data", function (chunk)
            {
                chunks.push(chunk);
            })
            res.on("end", function()
            {
                var body = Buffer.concat(chunks);
                var temp = JSON.parse(body);
                this.setState({
                    token: "Token " + temp.accessToken,
                });
                console.log(token);
                console.log('here1');
            });
        });
        req.end();
    }

    async fetchCustomer(token, options2)
    {
        var http = require("https");
        var req = http.request(options2, function (res)
        {
            var chunks = [];
            res.on("data", function(chunk)
            {
                chunks.push(chunk);
            });
            res.on("end", function()
            {
                var body = Buffer.concat(chunks);
                var temp = JSON.parse(body);
                this.setState({
                    cid: temp.items[0].customerId,
                });
                console.log(this.state.cid);
                console.log('here2');
            });
        });
        req.end();
    }

    init(flex, manager)
    {
        console.log('here0');
        var options =
        {
            "method": "GET",
            "hostname": "api.foobar.com/api/v1/token",
            "headers": 
            {
                "Authorization": "sometoken",
            }

        };
        var options2 =
        {
            "method": "GET",
            "hostname": "api.foobar.com",
            "path": "/api/v1/customers?phoneHome=1111111111",
            "headers": 
            {
                "Authorization": this.state.token,
            }
        };
        this.fetchToken(options);
        this.fetchCustomer(this.state.token, options2);

        stuff.CRMContainer.defaultProps.uriCallback = (cid) =>
        {
            return  `https://foobar.com/Default.aspx?cid=${this.state.cid}`;
        }
    }
}

Answer 1

使用箭头函数，以免丢失上下文，this必须与父类绑定：

res.on("end", () =>  // Arrow function here will keep 'this' context
        {
            var body = Buffer.concat(chunks);
            var temp = JSON.parse(body);
            this.setState({
                token: "Token " + temp.accessToken,
            });
            console.log(token);
            console.log('here1');
        });