Question

我想要连接到coincap.io公开socket.io API。我已经完成了所有设置但不知道我的组件中放置socket.io代码的位置。它是在constructor还是componentWillMount还是在哪里？它的socket.io所以它显然总是需要打开，所以在一个组件中它会去哪里？这是我需要将代码注入到我的组件中的代码：

this.socket = io.connect('http://socket.coincap.io');
this.socket.on('connect', function(tradeMsg) {
    console.log("It worked");
});

Answer 1

您可以将componentDidMount(){ this.socket = io.connect('http://socket.coincap.io'); this.socket.on('connect', function(tradeMsg) { console.log("It worked"); }); }代码添加到＆＃39; componentDidMount`中。参考link

{{1}}

Answer 2

它是否包含在构造函数或componentWillMount中？

检查这些答案有关详细信息：

Can I call APIs in componentWillMount in React?

Why do the React docs recommend doing AJAX in componentDidMount, not componentWillMount?

在我的组件中放置socket.io代码的位置？

使用componentDidMount生命周期方法，它只会在组件成功安装后触发一次，我们应该在其中编写所有类型的网络调用。

根据 DOC ：

componentDidMount（）在组件出现后立即调用安装。需要DOM节点的初始化应该放在这里。如果你需要从远程端点加载数据，这是一个好地方实例化网络请求。在这种方法中设置状态会触发重新渲染。

像这样写：

componentDidMount(){
    this.socket = io.connect('http://socket.coincap.io');
    this.socket.on('connect', function(tradeMsg) {
        console.log("It worked");
    });
}

将socket.io代码放在组件中的位置？

2 个答案: