別の条件文の中React.js条件文の問題

Question

意図は「SORTBYは」特定の値に等しい場合は、条件付きの要素を表示するには..です

私は、単一の条件文を行うことができますが、ときに私は内部の別を追加私はここに二重の条件文を構築するにはどうすればよい

export const TableHeaders = (props) => { 
    const { handleSubmit } = props 

    const { sortBy, sortDirection} = props 

    return (
     <div> 
     <div className="row"> 
      <div className="col-md-1" style={headingCellStyle}>Client #</div> 
      <div className="col-md-6" style={headingCellStyle}> 
      Name/Address 
      {sortBy === 'LastName' (
       <span> 
       {sortDirection === 'Descending' ? (
        <span className='glyphicon glyphicon-sort-by-attributes'></span> 
        ) : (
        <span className='glyphicon glyphicon-sort-by-attributes-alt'></span> 
        ) 
       } 
       </span> 
      )} 

      {console.log(`Sort Direction ${sortDirection}`)} 
      </div> 
      <div className="col-md-2" style={headingCellStyle}>Phone</div> 
      <div className="col-md-1" style={headingCellStyle}>Jobs</div> 
      <div className="col-md-2" style={headingCellStyle}>Actions</div> 
     </div> 
     </div> 
    ) 
    } 
    TableHeaders.propTypes = { 
    onSubmit: PropTypes.func.isRequired, 
    } 

    const TableHeadersForm = reduxForm({ 
    form: 'SearchClients', 
    })(TableHeaders) 

    export default TableHeadersForm 

：ここ

Exception: Call to Node module failed with error: TypeError: "LastName" is not a function

との最初のもの、それはエラーが私のコードですか？

"sortDirection"条件文だけが機能しますが、 "sortBy" condtional文を追加すると失敗します。私が最初に「SORTBY」かどうかを確認することを意図してい

は..「姓」と言うに等しいので、次に「sortDirection」をチェックすると、「昇順」または「降順」と応じglyphonを表示するのいずれかである

Answer 1

あなたは?を逃しただけでなく、第一の条件のfalse場合、あなたはこのようにそれを記述する必要があります。あなたはこのものようにそれを書くことができfalse場合render何にもしたくない場合は

{sortBy === 'LastName' ? 
    <span> 
    { 
     sortDirection === 'Descending' ? 
      <span className='glyphicon glyphicon-sort-by-attributes'></span> 
     : 
      <span className='glyphicon glyphicon-sort-by-attributes-alt'></span> 
    } 
    </span> 
: 
    null //or some element 
} 

：

{sortBy === 'LastName' && <span> 
    { 
     sortDirection === 'Descending' ? 
      <span className='glyphicon glyphicon-sort-by-attributes'></span> 
     : 
      <span className='glyphicon glyphicon-sort-by-attributes-alt'></span> 
    } 
    </span> 
}