使用Router切换组件时，多次渲染方法调用函数

Question

在开发第一个ReactJS应用程序的过程中，我注意到在某些情况下，当我使用Router链接切换到其他组件时，render方法会多次调用该函数。 我不确定这是否正确，或者就编码标准而言这是错误的。

以下示例案例：

组件1-主页组件2-电视

步骤1 ：应用程序加载了主页，然后我移到了TV Component，这次控制台仅记录一次数据。

步骤2 ：加载电视组件后，我将再次通过标题中徽标中的链接转到首页。

第三步 ：再次，如果我通过链接进入电视页面，这次控制台将记录4次数据。

Route.js

const Routes = () => (
<BrowserRouter>
<Route exact path='/' component={HomePage} />
<Route path='/tv' component={TV} />
</BrowserRouter>
);
export default Routes;

电视组件

class Tv extends Component {
componentDidMount() {
   this.props.tvFetchData();
}
createTvList = () => {
   let sub_videos = this.props.tv.sub_videos
     if (sub_videos) {
       console.log(sub_videos);
     } else {
       return 'loading...'
     }
}
render() {
   return (
      <div className="tv-wrapper">
         {this.createTvList()}
      </div>
     );
   }
}

链接到menu.js

<Link to={menu.link} className="nav-link">{menu.name}</Link>

请让我知道这种方法是否有问题？