bootstrap-select not working with ajax

Question

JavaScript:

var books = new Vue({
    el: '#book_app',
    data : {
        book_list : ''
    }
    created: function() {
        $.ajax({
            type: 'get',
            url: '/admin/book/get',
            data: {
                member: memberCode
            },
            success: function (result) {
                this.book_list = result;
                $('#book_select').selectpicker('refresh');
            }
        });
    }
});

HTML:

...
<div id='book_app'>
    <select class='selectpicker' id='book_select'>
       //each book object has 'name' and 'code' attributes.
       <option v-for="book in book_list">{{book.name}}</option>
    </select>
</div>
...

I see all the books in Network tab in Chrome dev tool, also see all the option with book name in the Elements tab. But the options list doesn't appear in the web page.