Question

我正在研究ReactJS应用程序，我正在尝试在下拉列表中获取所选选项的 text （语义UI组件）;

exposedCampaignOnChange = (e, {value}) => {
    this.props.campaignExposedSelected(value);
};

<Dropdown
    placeholder='Campaign Exposed To'
    fluid
    search
    selection
    multiple
    options={this.state.campaigns}
    onChange={this.exposedCampaignOnChange}
/>

以上代码返回值。 this.state.campaigns由具有value和text属性的对象数组组成。除了value之外，我还希望获得所选选项的text值。

感谢有关此事的任何指导。

Answer 1

您可以使用合成事件的target属性来获取如下文本：

exposedCampaignOnChange = (e, {value}) => {
  e.persist();
  console.log(e.target.textContent);
  this.props.campaignExposedSelected(value);
};

<Dropdown
  placeholder='Campaign Exposed To'
  fluid
  search
  selection
  multiple
  options={this.state.campaigns}
  onChange={this.exposedCampaignOnChange}
/>

Answer 2

语义ui react Dropdown onChange事件有两个参数 - onChange(event: SyntheticEvent, data: object)。在调用函数时，您不需要显式传递它们。

exposedCampaignOnChange = (e, value) => {
  e.persist();
  this.props.campaignExposedSelected(value);
};

Answer 3

数据/值应该已经选择了选项文本，例如语义UI

function getSelectedTextValue() {
  alert( $('.ui.dropdown').dropdown('get text') + " : " + $('.ui.dropdown').dropdown('get value') );
}

如何在ReactJS中获取所选<dropdown>选项的文本？

3 个答案: