Question

我的index.tsx中有这个简单的代码

let state = {};

window.setState = (changes: any) => {
       state = Object.assign({}, state, changes);

 ReactDOM.render(<App {...state} />, document.getElementById("root"));
};

但是我得到的错误是

类型“窗口”上不存在属性“ setState”。

在我的依存关系中，我具有以下

"dependencies": {
"@types/react": "^16.7.7",
"@types/react-dom": "^16.0.11",
}

我正在关注React Auth

Answer 1

对于那些说应该为this.setState()的人来说，我认为不应该。不幸的是，React Auth库给出的示例正在定义一个名为setState()的怪异且命名错误的全局函数（在React的上下文中）。

这是链接中提供的示例JavaScript：

import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import App from "./App";

let state = {};
window.setState = changes => {
    state = Object.assign({}, state, changes);

    ReactDOM.render(<App {...state} />, document.getElementById("root"));
};

/* eslint no-restricted-globals: 0*/

let initialState = {
    isLoggedIn: false,
    signup: function () {
        window.open(
            "https://auth0.com/signup?utm_source=stackblitz&utm_medium=devsponsor&utm_campaign=stackblitz-react",
            "_blank"
        );
    }
};

window.setState(initialState);

您只需要扩展window即可保持TypeScript满意：

declare global {
    interface Window {
        setState: (changes: any) => void;
    }
}

let state = {};

window.setState = (changes: any) => {
    state = Object.assign({}, state, changes);
};

尽管除非我遗漏了某些东西，但这看起来似乎是一个糟糕的实现。您应该使用React的状态（和/或类似Redux的状态），而不是在其中一个属性更改时重新渲染应用程序。

Answer 2

我认为不应该是window.setstate，应该是this.setstate({})

类型“窗口”上不存在属性“ setState”

2 个答案: