React + PropTypes和ESlint錯誤：如何驗證回調的道具

Question

我有來自react-router這條Route ：

<Route
    path="/:url*"
    exact
    strict
    render={props => <Redirect to={`${props.location.pathname}/`} />}
/>

它只是在沒有的路由后面加上斜線。

但ESLint上發出錯誤信號， props.location.pathname既是props.location和props.location.pathname不與驗證PropTypes 。

如何驗證它們？ 有辦法嗎？

注意：我不想忽略該規則：我想修復它以明確驗證道具！

Answer 1

好的，所以按照@Tiago Coelho對我的問題的評論，以下是解決方案：

// RedirectToTrailingSlash.jsx
import React from 'react';
import PropTypes from 'prop-types';
import { Redirect } from 'react-router-dom';

const RedirectToTrailingSlash = props => (
  <Redirect to={`${props.location.pathname}/`} />
);

RedirectToTrailingSlash
  .propTypes = { location: PropTypes.shape({ pathname: PropTypes.string.isRequired }).isRequired };

export default RedirectToTrailingSlash;

這是改寫的Route ：

// YourComponent.jsx
...
<Route
    path="/:url*"
    exact
    strict
    component={RedirectToTrailingSlash}
/>
...