使用React Router从数据库中的标签生成URL

Question

我有一个React SPA，可以显示数据库中的内容。

每次单击按钮时，React都会查询数据库，并在不更改URL的情况下更改内容。

我希望每次单击按钮以使React Router更改URL，以匹配与数据库中每个项目存储的段符。

这可能吗？

当前我的路线文件如下：

import React from 'react';
import { Route, Switch } from 'react-router-dom';
import Home from './Home.js';
import Component1 from './Component1.js';

export default () =>
(<Switch>
  <Route exact path="/" component={Home} />
  <Route path="/component1" component={Component1} exact />
  <Route path="/component1/:product" component={Component1} />
</Switch>);

这意味着，如果我转到www.url.com/component1/bananas，则可以将prop的{​​{1}}作为bananas传递给组件Component1。

但是，我认为这对我没有帮助。

对于this.props.match.params.product，我想从数据库中读取内容，以告诉React Router子弹应该是什么。

感觉问题与URL参数有关-但我想动态生成URL，而不是动态匹配URL。

React组件如下所示：

Component1