1

セマンティックモーダルを使用して、モーダルを反応させようとしています。何らかの理由で、フォームを閉じることはできますが、ディマーは残ります。私は助けが必要です。

私は $('.ui.modal').modal('hide dimmer') と他の多くのものを試しました。

モーダルはここにあります:

export default class AddCamerModal extends React.Component {
   constructor(props) {
      super(props);
   }

   render() {
      return (
         <Modal 
            id="add-camera-form" 
            trigger={<Button id="color-0093ee border-color-0093ee" 
            basic 
            icon="video-camera" 
            size="large"></Button>}
         >
            <Header icon='cube' content='New Object' />
            <Modal.Content>
               <AddCameraForm />
            </Modal.Content>
         </Modal>
      )
   }

フォームはこちら:

export default class AddCameraForm extends React.Component {
   constructor(props) {
      super(props);
   }

   closeModal() {
      $('.modal').modal('hide');
   }

   render() {
      return (
         <Form size="large">
            <Form.Group widths="equal">
               <Form.Field label='Name' control='input' placeholder='Name' name="name" id="name" required />
            </Form.Group>
            <Form.Group>
               <Button type='submit' className="submit" onClick={this.handleSave}>Save</Button>
               <Button type='deny' className="deny" onClick={this.closeModal}>Cancel</Button>
            </Form.Group>
         </Form>
      )
   }
}
4

3 に答える 3