Reactjs 在React、Typescript中获取查询参数

我有一个组件如下所示：

class MyView extends React.Component<{}, {}> {
    render() {
        console.log((this.props as any).params); // prints empty object
        return (
            <div>Sample</div>
        );
    }
}

类MyView扩展了React.Component{
render（）{
console.log（（this.props as any）.params）；//打印空对象
返回(
样品
);
}
}

我想打印URL查询参数，但得到一个空对象。 （是的，我知道我将{}声明为Props，但如果我不定义它，它就不会编译）

---

是否有方法将“默认”道具对象传递给我的组件，以便我可以访问

this.props.params

？或者应该在TypeScript中以不同的方式完成吗？

要为组件指定默认属性，您应该使用defaultProps：

class MyView extends React.Component<{}, {}> {
    render() {
        console.log((this.props as any).params); // prints empty object
        return (
            <div>Sample</div>
        );
    }
}

MyView.propTypes = {
  url: React.PropTypes.string
}

MyView.defaultProps = {
  url: ''
}

类MyView扩展了React.Component{
render（）{
console.log（（this.props as any）.params）；//打印空对象
返回(
样品
);
}
}
MyView.propTypes={
url:React.PropTypes.string
}
MyView.defaultProps={
url:“”
}

---

查看更多信息。

您需要定义道具和状态的类型，然后将它们放置在

{}

不清楚要从何处获取“URL查询参数”，因此我将从

窗口获取它们。位置
对象：

interface MyViewProperties {
    params: string;
}

interface MyViewState {}

class MyView extends React.Component<MyViewProperties, MyViewState> {
    render() {
        console.log(this.props.params); // should print "param1=value1&param2=value2...."
        return (
            <div>Sample</div>
        );
    }
}

ReactDOM.render(<MyView props={ window.location.search.substring(1) } />, document.getElementById("container"));

接口MyViewProperties{
参数：字符串；
}
接口MyViewState{}
类MyView扩展了React.Component{
render（）{
console.log（this.props.params）；//应打印“param1=value1¶m2=value2…”
返回(
样品
);
}
}
render（，document.getElementById（“容器”）；
如何渲染此组件？是否将此
param
属性传递给它？这不适用于TypeScript<编译器无法“看到”code>propTypes
和
defaultProps
。就是这样。谢谢