代码之家 › 专栏 › 技术社区 › Newton Sheikh

类型“window”上不存在属性“setstate”

typescript reactjs

Newton Sheikh · 技术社区 · 5 年前

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

let state = {};

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

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

但我得到的错误是

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

在我的依赖中,我有以下几点

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

我在跟踪这个 React Auth

2 回复 | 直到 5 年前

Ciarán Tobin 5 年前

对于那些说应该是 this.setState() 我不认为应该。不幸的是,由react auth库给出的示例定义了一个奇怪的、名字不好的(在react上下文中)全局函数 setState() .

以下是链接中给出的示例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的东西),而不是在其中一个属性发生更改时重新呈现应用程序。