Question

{IconsJson.map(obj => { 
     let className = 'sa-icon sa-icon-' + {obj.name};
     return <i className={className}>{obj.name}</i>
})}

为什么上面的语法无效？地图是es6。

Answer 1

像这样写：

{
   IconsJson.map((obj,i) => { 
       let className = `sa-icon sa-icon-${obj.name}`;
       return <i key={i} className={className}>{obj.name}</i>
   })
}

注意：为每个元素分配唯一键，否则会抛出警告。查看DOC。

Answer 2

试

{IconsJson.map(obj => { 
     let className = 'sa-icon sa-icon-' + obj.name;
     return <i className={className}>{obj.name}</i>
})}

Answer 3

当将JSX语法与常规JS混合使用时，通常会出现这类问题。你可以试试这个 -

{
    IconsJson.map(
        obj => <i key={obj.name} 
                    className={`sa-icon sa-icon-${obj.name}`}>{obj.name}</i>
    )
}

jsx add dynamic className出现意外令牌错误

3 个答案: