从 json 错误中有条件地渲染 plyr-react 媒体的问题

Question

尝试有条件地渲染 JSON 文件中的不同媒体 (audio/video)，但出现错误。

代码如下：

   {surgeryData.map(data => (
      <div>
         <Plyr
            source={
               ((type = {data.type}),
               (sources = [
                  {
                     src = {data.media}
                  }
               ]))
            }
         />
      </div>
   ))}

无论我是在 source 之后使用 = 还是 : react 似乎都不喜欢 source 中的嵌套数据。有什么解决办法吗？

Answer 1

根据 the documentation，源应该是这样的对象。

{surgeryData.map((data) => (
  <div>        
    <Plyr
      source={{
        type: data.type,
        sources: [
          {
            src: data.media
          }
        ]
      }}
    />
  </div>
 ))}