首页 > 解决方案 > 在渲染中调用的函数中的反引号

问题描述

我在这里做错了什么?我正在返回return children;一个在 render() 中调用的函数

children.push(<img key="`${this.data_images.hits[i].id}`" src="`${this.data_images.hits[i].previewURL}`"/>)

警告:遇到两个孩子用同一个钥匙,${this.data_images.hits[i].id}

渲染的输出是

<img src="`${this.data_images.hits[i].previewURL}`">

标签: reactjsbackticks

解决方案


"`${this.data_images.hits[i].id}`"

如果您想让模板正常工作,这是一个简单的字符串 - 您需要删除 qoutation 并改为 {}。

所以代码是

children.push(<img key={`${this.data_images.hits[i].id}`} src={`${this.data_images.hits[i].previewURL}`}/>)

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


推荐阅读