2016-12-12 9 views
5

ログインしていて、非表示にしたくない場合は、次の3項演算子を追加してボタンを表示しようとしています。以下は、私の間違いを投げつけ続けています。React Jsを使用した3次演算子Es 6

<img src={this.state.photo} alt="" style="{isLoggedIn ? 'display:' : 'display:none'}" /> 
+1

これは正しい方法です:style = {isLoggedIn? {display: 'block'}:{display: 'none'}} –

+0

私はすでに同じ回答バディを追加しています – FurkanO

+0

Doh、ちょうどここにそれを書いて、引用符を無視します。長い一日... – user992731

答えて

9

スタイル属性に指定するものは、オブジェクトである必要があります。 jsxでは中括弧の間にjsコードを書くので、そこにオブジェクトを挿入します。

すべてのCSSの小道具をキャリングする必要があります。 (フォントサイズ==>のfontSize)

<img 
    src={this.state.photo} 
    alt="" 
    style={ isLoggedIn ? { display:'block'} : {display : 'none'} } 
/> 

又は

<img 
    src={this.state.photo} 
    alt="" 
    style={ { display: isLoggedIn ? 'block' : 'none' } } 
/> 

Iは、第二のものを好むだろう。

+1

トリックをしたおかげで@FurkanO! – user992731

-2
style={isLoggedIn ? 'display:block' : 'display:none'} 

quotemarksを削除する - それは(isLoggedInがブールっぽいであると仮定して)、次に動作する必要があります。

関連する問題