Question

目的是有条件地显示元素，如果＆＃34; sortBy＆＃34;等于特定值..

我可以做一个条件语句，但是当我在第一个条件语句中添加另一条条件语句时，它会错误地用

异常：调用节点模块失败，错误：TypeError：＆＃34; LastName＆＃34;不是一个功能

这是我的代码：

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

如何在此构建双条件语句？

我发现只有＆＃34; sortDirection＆＃34;条件语句只有作用，但添加＆＃34; sortBy＆＃34;围绕它的条件声明失败。

我首先打算检查＆＃34; sortby＆＃34;等于＆＃34; LastName＆＃34;如果是，那么检查＆＃34; sortDirection＆＃34;要是＆＃34; Ascending＆＃34;或者＆＃34; Descending＆＃34;并相应地显示一个字形..

Answer 1

你错过了?以及false第一个条件的情况，你需要这样写：

{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
}

如果您不希望在render案例中false任何事情，您也可以这样写：

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

React.js条件语句在另一个条件语句中的问题

1 个答案: