визуализировать состояние в функции карты и добавить стиль реагировать JS

Question

Я хочу добавить некоторый стиль в состояние с помощью функции карты и, наконец, добавить элементы в таблицу. Я использую этот код

    columnClassNameFormat(fieldValue ) {
    const Event =this.state.Event;
    console.log(Event);

    this.state.Event.events.map(function (item) {
        if (item.event_type === 'A') {

         <span class="label label-danger">{fieldValue}</span>
        }
        else if (item.event_type === 'W') {
        <span class="label label-warning">{fieldValue}</span>
        }
        else if (item.event_type === 'I') {
            <span class="label label-info">{fieldValue}</span>
        } else {
          <span class="label label-info">{fieldValue}</span>
        }
    }).bind(this)


 }

, и после этого я показываю элементы в таблице как этот

<BootstrapTable data={this.state.Event}  exportCSV title='Infravision-Report' pagination search>
                        <TableHeaderColumn dataField='event_title' isKey={ true }>Discription</TableHeaderColumn>
                        <TableHeaderColumn dataField='time' dataSort={ true }>Date time</TableHeaderColumn>
                        <TableHeaderColumn dataField='event_status' columnClassName={this.columnClassNameFormat } >status</TableHeaderColumn>


                    </BootstrapTable>

но это не работа и стиль не добавляют к пунктам

Answer 1

Ваша функция карты должна иметь операторы возврата типа

this.state.Event.events.map(function (item) {
        if (item.event_type === 'A') {

         return <span class="label label-danger">{fieldValue}</span>
        }
        else if (item.event_type === 'W') {
        return <span class="label label-warning">{fieldValue}</span>
        }
        else if (item.event_type === 'I') {
           return  <span class="label label-info">{fieldValue}</span>
        } else {
         return  <span class="label label-info">{fieldValue}</span>
        }
    }) .bind(this)