es6反応の小道具としてのリテラル文字列の連結

Question

明らかに以下のコードは機能しません。正直なところではどうすればいいのか分かりません。

<div>       
    <Dropdown labelName="Settings" listItems={[ 
    {name:'View Listing', handlerName:'view_listing'}, 
    {name:'Edit Listing', handlerName:'edit_listing'}, 
    {name:`${this.state.spaceStatus} === 'active' ? 'Deactivate Listing': 'Activate Listing'`, handlerName:'deactivate_listing'}, 
    ]}/> 
</div> 

私はサイドから私のロジックを行うことができますが、これが実行可能かどうかであることを確認し、インラインそれをしないしようとしていました。

Answer 1

テンプレートリテラルトークンが終了したばかりです。

<div>       
    <Dropdown labelName="Settings" listItems={[ 
    {name:'View Listing', handlerName:'view_listing'}, 
    {name:'Edit Listing', handlerName:'edit_listing'}, 
    {name:`${this.state.spaceStatus === 'active' ? 'Deactivate Listing': 'Activate Listing'}`, handlerName:'deactivate_listing'}, 
    // >>>---------------------------------------------------------------------------------^ 
    ]}/> 
</div> 

：あなたの全体の条件演算子式はちょうど 'Activate Listing'の終了後に }を移動し、 ${...}にする必要があります