如何修复无效的动态href

Question

我正在尝试在该地图中创建动态href。但是，当我单击按钮时，它似乎并没有改变路线。另外，我不能使用Link，因为它告诉我不能在路由器外部使用

const categories = [];
const menuItems= [];

{this.state.breweries.slice(0,10).map((brewery) =>
  categories.push(brewery.brewery_type)
)}

const uniqueCategories = Array.from(new Set(categories));

uniqueCategories.sort(function(a, b){
if(a < b) { return -1; }
if(a > b) { return 1; }
return 0;
})

const optionTemplate = uniqueCategories.map(v => (
  <MenuItem className="cat-dropdown" key={v.id}>
    <a href={`/` + v}>{v}</a>
  </MenuItem>
));