添加自定義HTML沒有價值的JSX

Question

屬性我有一些HTML需要定製的，沒有價值取決於形勢的屬性。例如，這些都是有效的：

<div className="playlist-row" selected> 
<div className="playlist-row" active> 
<div className="playlist-row"> 

我試圖做類似

let customAttr = {'active'}; // incorrect syntax 
let customAttr = {'active': true}; //doesn't work 
let customAttr = {'active': ''}; //doesn't work 

<div className="playlist-row" {...customAttr}> 

任何想法，我如何得到這個工作？

Answer 1

我相信這應該做到這一點 - 在你的render()功能：

render() { 
    let customAttr = "active" 

    return (
     <div className={"playlist-row " + customAttr}> 
    ) 
} 

或者交替，你可以避開字符串連接...

<div className={`playlist-row ${customAttr}`}>