Как обрабатывать onClick, а не href <a>

Итак, я использую плагин jquery, и для его правильной работы мне нужно, чтобы кнопка моей книги (в стиле кнопки) находилась внутри тега привязки. Мой компонент реакции выглядит так:

export default class Header extends React.Component {
constructor(props){
    super(props);
    this.state  = {
        showModal: false,
    };
    this.openModal = this.openModal.bind(this);
    this.exitModal = this.exitModal.bind(this);
}


openModal(){
    console.info('hello');
    this.setState(()=> ({showModal: true}));
    return false;
}

exitModal(){
    this.setState(()=> ({showModal: false}));
}

render(){
    return (
        ...

            <li>
                <a id = "navbar-book" href = "#" onClick = {this.openModal} className = "book-button"><span>Book Now</span></a>
            </li>
        ...
             <BookModal 
                showModal = {this.state.showModal}
                exitModal = {this.exitModal}
            />  

    )
}

};

Я не хочу иметь href, но если у меня его нет, мой плагин dropotron не будет работать с ним. Я уже пытался вернуть false из функции в надежде, что href не запустится. Все, что мне нужно, это запустить модальное окно.