ESLint React-Router v4 - 如何验证Match params props?

时间:2017-09-29 07:37:49

标签: reactjs eslint react-router-v4

我使用React-Router v4' Match object将params传递给下一个组件。我的路由就像:

private void winAppToolStripMenuItem_Click(object sender, EventArgs e)
    {
        Upload objWA = new Upload();
        objWA.MdiParent = this;
        objWA.Show();
        //objWA.WindowState = FormWindowState.Maximized;
    }

    private void userInfoToolStripMenuItem_Click(object sender, EventArgs e)
    {
        Reports objUI = new Reports();
        objUI.MdiParent = this;
        objUI.Show();
        DisposeAllButThis(Form objUI);
        //objUI.WindowState = FormWindowState.Maximized;
    }
    public void DisposeAllButThis(Form form)
    {
        foreach (Form frm in this.MdiChildren)
        {
            if (frm.GetType() == form.GetType() 
                && frm != form)
            {
                frm.Dispose();
                frm.Close();
            }
        }
    }

我的子组件如下:

<Switch>
  <Route exact path="/" component={ExperimentListPage} />
  <Route path="/experiment/:experiment" component={ExperimentResultsPage} />
</Switch>

这一切都按预期工作,但是ESLint对我使用const ExperimentResultsPage = props => ( <ExperimentResultsContainer experimentName={props.match.params.experiment} /> ); export default withRouter(ExperimentResultsPage); 非常不满意,而match.params.experiment

错误

我在React文档中看到我可以使用PropTypes.shape但是我的params对象但是我希望有更好的方法,特别是因为Match对象包含很多字段。

有没有更好的方法将Match路线对象添加到道具验证中?那会是什么样子?如果没有,我是否缺少其他可以帮助解决此问题的方法?

2 个答案:

答案 0 :(得分:7)

我碰到了类似的东西,eslint似乎很好,只是声明我使用道具并忽略匹配中未使用的字段:

  match: PropTypes.shape({
    params: PropTypes.shape({
      experiment: PropTypes.string,
    }),
  }).isRequired,

答案 1 :(得分:0)

在组件期望对象具有不同形状的不同键的情况下,最好的方法是在PropTypes.any内使用objectOf,如下所示:

 match: PropTypes.objectOf(PropTypes.any),