相关疑难解决方法(0)

我是 reactJS 的新手，正在编写代码，以便在从 DB 加载数据之前，它会显示加载消息，然后在加载后，使用加载的数据渲染组件。为此，我同时使用了 useState 钩子和 useEffect 钩子。这是代码：

问题是，当我检查 console.log 时，useEffect 被触发了两次。因此，代码两次查询相同的数据，这是应该避免的。

下面是我写的代码：

import React from 'react';
import './App.css';
import {useState,useEffect} from 'react';
import Postspreview from '../components/Postspreview'

const indexarray=[]; //The array to which the fetched data will be pushed

function Home() {
   const [isLoading,setLoad]=useState(true);
   useEffect(()=>{
      /*
      Query logic to query from DB and push to indexarray
      */
          setLoad(false);  // To indicate that the loading is complete
    })
   },[]);
   if (isLoading===true){
       console.log("Loading");
       return <div>This is loading...</div>
   }
   else {
       console.log("Loaded!"); …

我的 React 组件渲染了两次。所以，我决定逐行调试，问题就在这里

 if ( workInProgress.mode & StrictMode) {
        instance.render();
      }

React-dom.development.js

是因为严格模式吗？我可以禁用它吗？什么是严格模式？我需要吗？

我正在使用Yii框架并OpenTok API与之集成PUSHER API.当我厌倦了创建PUSHER事件实例时,就建立了连接.但几秒钟后,连接自动关闭,并给出错误,例如:Pusher:Error:{"type":"WebSocketError","error":{}}.我正在尝试推送库版本1.11.2和1.12(但同时)进行测试.

控制台日志:

Pusher : State changed : initialized -> connecting
    Firefox can't establish a connection to the server at ws://ws.pusherapp.com/app/?protocol=5&client=js&version=1.1....
    Pusher : State changed : connecting -> connected
    Pusher : State changed : connecting -> disconnected

我已经检查了telnet ws.pusherapp.com 443,80和843,但我得到的是Connection被外国主机关闭.

是否有任何方法或东西我缺乏调试或测试？需要一些帮助来避免这种警告.

我用过

chrome版本23.0.1271.97

Ubuntu 12.04

Firefox 18.0

我一直在家里和办公室的计算机上鬼混ReactJS。在家里，我正在使用Visual Studio 2019，NodeJS 10.16.2，NPM 6.9.0和Webpack 3.11.0。

首次启动项目时，正在热装DID工作。在某个时候，它停止工作了。我以为我可能是在无意中对程序包或设置进行了一些更改，因此我从头开始创建了一个全新的解决方案，但仍然无法正常工作。因此，显然我已经对我的机器做了一些操作，但是我无法想象。

在工作中，还使用Visual Studio 2019（我必须检查其他版本），热重载确实可以工作。

谁能想到我可能偶然做的某件事导致它停止工作？还是尝试使其再次正常工作的方法？我已经尝试过几乎在网上找到的所有内容，但是其中大部分都不是最近的，都没有帮助。

根据要求的package.json文件：

{
  "name": "jobs",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "axios": "^0.19.0",
    "bootstrap": "^4.1.3",
    "faye-websocket": "^0.11.3",
    "jquery": "3.4.1",
    "lodash": "^4.17.15",
    "merge": "^1.2.1",
    "oidc-client": "^1.9.1",
    "react": "16.9.0",
    "react-dev-utils": "^9.0.3",
    "react-dom": "^16.0.0",
    "react-loading-overlay": "^1.0.1",
    "react-router-bootstrap": "0.25.0",
    "react-router-dom": "5.0.1",
    "react-scripts": "3.1.1",
    "react-spinners": "0.6.1",
    "react-transition-group": "^4.2.2",
    "reactstrap": "8.0.1",
    "rimraf": "3.0.0",
    "toastr": "^2.1.4"
  },
  "devDependencies": {
    "ajv": "^6.9.1",
    "cross-env": "^5.2.1",
    "eslint": "6.3.0",
    "eslint-config-react-app": "5.0.1",
    "eslint-plugin-flowtype": "4.2.0",
    "eslint-plugin-import": "^2.18.2",
    "eslint-plugin-jsx-a11y": "6.2.3",
    "eslint-plugin-react": "^7.14.3"
  },
  "eslintConfig": …