reactjs - カスタムトリガーの問題を伴う React-bootstrap Modal

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" を削除するたびに、モーダルが機能します。回避策はありますか？前もって感謝します。