我加入了一个正在进行的react项目,以进入案例研究。我们正在为表单和表单下拉菜单使用语义 UI。我想要做的是在下拉菜单中添加一个按钮来启动另一个菜单。
我不确定在哪里添加按钮的代码,或者是否可能。这是下拉菜单的当前代码:
<h1 className="ui centered">Select Engagement Details</h1>
<Form.Group widths="equal">
<Form.Dropdown
fluid
selection
placeholder="Client Name"
onChange={(e, { value }) => {
this.props.handleDropdown({
input: "clientName",
value: value,
optionType: "clientOptions",
options: this.state.clients
});
}}
defaultValue={values.clientName}
options={this.state.clients}
/>
<Form.Dropdown
fluid
selection
placeholder="Engagement Name"
onChange={(e, { value }) => {
this.props.handleDropdown({
value: value,
input: "engagementName",
optionType: "engagementNameOptions",
options: this.state.engagements
});
}}
defaultValue={values.engagementName}
options={this.state.engagements}
/>
</Form.Group>
<Button disabled={!isEnabled} onClick={this.saveAndContinue}>
{" "}
Continue
</Button>
{/* starts new engagement area */}
<hr style={{marginTop: '30px'}}/>
<h2 className="ui centered"> New Engagement </h2>
<Form.Group controlId="newEngagementGroup" widths="equal">
{/* type is not required. Type is useful for common types like "email" or "password" */}
<Form.Input
type="clientName"
placeholder="Enter Client Name"
ref="newClient"
onChange={(e, { value }) => {
this.props.handleDropdown({
input: "newEngagementClientName",
value: value
})
}}
defaultValue={values.newClientName}
/>
<Form.Input
type="engagementType"
placeholder="Enter Engagement Type"
ref="newEngagementType"
onChange={(e, { value }) => {
this.props.handleDropdown({
input: "newEngagementType",
value: value
})
}}
defaultValue={values.newEngagementType} />
</Form.Group>```