具有自定义触发器问题的React-bootstrap模式

Question

如果模态中有ref="xxx"的元素，则模态将不起作用。例如：

<Modal title={this.props.action + ' Virtual Software'} onRequestHide={this.handleToggle}>
    <div className='modal-body'>
        <div className="form-group">
            <label className="control-label col-md-2" for="Name">Name</label>
            <div className="col-md-10">
                <input type="text" className="form-control" id="Name" name="Name" ref="Name" required />
            </div>
        </div>
    </div>
    <div className='modal-footer'>
        <button type="button" onClick={this.handleToggle} className="btn btn-white" data-dismiss="modal">Close</button>
        <button type="button" onClick={this.handleAdd} className="btn btn-primary">Save</button>
    </div>
</Modal>

每当我删除ref =“Name”时，模态都有效。任何解决方法？提前谢谢。