javascript - 如何在Signalr connection.on()中设置组件的状态

我想从带有Signalr的服务器获取数据并更新React组件的内容。一切都好。从服务器接收的数据BUT组件的状态无法更新(未定义)。

这是我的代码:

import React, { Component } from 'react';
import { ToastComponent } from '@syncfusion/ej2-react-notifications';
import * as signalR from '@aspnet/signalr';


class Notification extends React.Component {

    constructor() {
        super(...arguments);
        this.position = { X: 'Right', Y: 'Top' }
        this.state = { message:null}

    }

    toastCreated() {
        this.toastInstance.show({ timeOut:0 })
    }

    componentWillMount() {
        const notifConn = new signalR.HubConnectionBuilder().withUrl("/notif").build();
        notifConn.on("ReceiveMessage", function (msg) {
            this.setState = ({ message: msg })

        });
        notifConn.start().then(function () {
            notifConn.invoke("SendNotification");

        }).catch(function (er) {
            console.log(er.toString());
        });


    }

最佳答案

setState是一个函数，所以

this.setState = ({ message: msg })

相 react 该是

this.setState({ message: msg })

此外，您的函数将无法访问您的类的this。因此，您应该使用保留上下文的箭头函数，而不是普通的匿名函数:

notifConn.on("ReceiveMessage", (msg) => {
   this.setState({ message: msg })
});

关于javascript - 如何在Signalr connection.on()中设置组件的状态，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/57344739/