下拉按钮响应将 json ID 传递到 HREF

Question

如何将 cls.id 传递到 href 中，以便在 React 上下拉按钮？正如您在 href 部分中看到的href="/teams/{cls.id}似乎不起作用。

return (
<DropdownButton id="dropdown-team-button" title={this.props.team_name}>
{this.state.data.map(cls => (
<div key={cls}>
<Dropdown.Item onClick={this.handleTeamSelection} href="/teams/{cls.id} "title={cls.name}>{cls.name}</Dropdown.Item>
</div>
))}
</DropdownButton>
)
}

Answer 1

试试这个

<DropdownButton id="dropdown-team-button" title={this.props.team_name}>
{this.state.data.map(cls => (
<div key={cls}>
<Dropdown.Item onClick={this.handleTeamSelection} href=`/teams/${cls.id}` title={cls.name}>{cls.name}</Dropdown.Item>
</div>
))}
</DropdownButton>

Answer 2

有两种常见的方法：

经典的Javascript语法：

href={'/teams/' + cls.id}

ES6 Javascript 版本的模板文字：

href=`/teams/${cls.id}`

两者的作用相同，工作方式完全相同。

---

有关 ES5 和 ES6 上的模板字符串/文本的详细信息：

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals