reactjs – 包含变量的React渲染链接

发布时间：2020-12-15 20:14:48 所属栏目：百科来源：网络整理

导读：我正在尝试执行以下操作： tbody {projects.map(function(project,i) { return ( tr key={i} td {project.id} /td td a href='#/systemlist?projId={project.id}'{project.name}/a /td /tr );} )}/tbody 应该使用路由器指向另一个组件.这一切都有效,除了{pro

我正在尝试执行以下操作：

<tbody>
    {projects.map(function(project,i) { return (
    <tr key={i}>
        <td>
            {project.id}
        </td>
        <td>
            <a href='#/systemlist?projId={project.id}'>{project.name}</a>
        </td>
    </tr>
    );} )}
</tbody>

应该使用路由器指向另一个组件.这一切都有效,除了{project.id}没有呈现为值.怎么做？ href以外的所有其他工作都可以.

解决方法

有几种方法可以解决这个问题

>字符串连接

<a href={ '#/systemlist?projId=' + project.id }>{project.name}</a>

> ES2015 string templates

<a href={ `#/systemlist?projId=${project.id}` }>{project.name}</a>

Example

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!