javascript - 将字体粗细更改为粗体以在reactjs中获得下拉值

我有以下代码作为回报。它正在创建一个下拉值。我想将$ {status}和$ {dataIdText}的下拉值的字体权重更改为粗体

   <Modal.Body className="container-fluid">
  <div className='row'>
    <label className='col-sm-4' htmlFor='portalSelector'>Exiting item: </label>
    <select className='col-sm-8' id='portalSelector' onChange={this.onSelectionChange} value={this.state.selectedItem}>
      <option key='-1' label='--Make a selection--' value='-1' />
      {((dataId === '') ? stateVar : stateVar.filter((val)=> (val.dataId +"") === dataId )).map((p, index) => {
        const status = p.status === 'PENDING' ? '' : p.status === 'SENT'?'':'Unscheduled'
        const dataIdDef = datasets.filter((val)=> val.dataId === p.dataId )[0]

        const dataIdText = p.dataId === -1? '' : `${dataIdDef.dataIdname} - `

        const scheduleDtText = p.scheduleDt === 5711817600000 ? '' : 'scheduled for ' + moment(p.scheduleDt).format('DD/MM/YYYY HH:mm')
        return (<option
          className='data'
          key={index}
          value={index}
          label={`${status} ${dataIdText} ${p.title} ${scheduleDtText}`}>

        </option>)
      }
      )}
    </select>
  </div>
</Modal.Body>

我试图删除label属性并将文本放置在Options标签本身内，但是没有运气。

最佳答案

试试这个形状

  label={()=>( <span className="bold">{status}<span className="bold"> {datasetIdText}<span/> {p.title} {scheduleDtText}`}>