Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

AndrewCostello's avatar

Has anyone had any luck getting this setup via Elixir and Browserify? I can't seem to get it to work unfortunately. I have tried piping through babel but that also did not seem to help. Is it better just to require the dist to the window?

This is a really great set of components I would just like to use them properly.

thomaskim's avatar

On the previous page:

I'am adding Browserify support for VueStrap, Just wait for a little bit longer. :)

1 like
AndrewCostello's avatar

Ah I misunderstood the bower comment, thanks. I have got it working with browserify by exposing it to window.VueStrap for now.

Most things are great and provide flexibility but I am having an issue with modals, I have my main body inside the:

<modal title="{{ title }}" show="{{@showPreview}}" effect="fade" width="800">
    <content>
        My custom content here
    </content>
</modal>

Which gives full control over the body but it would be nice to also have the same control over the header and footer.

One option would be for full support using inline-template. I have tried this but it seems like the component still attempts to manipulate the template.

fercho's avatar

I could make it pop,

<div id="mmod">
 <button class="btn btn-default btn-lg" v-on="click:showModal = true">Show modal </button>
                    <modal title="Modal" show="@{{@showModal}}" effect="fade" width="400">
                    ....
                    </modal>
    </div>

js

var modal = VueStrap.modal
new Vue({
    el:'#mmod',
    components: {
        'modal':modal
    },
    data: {
        showModal: false
    }
});

My issue was, that I was trying to use it in a V-repeat but with and #id, so now I need to know how to reuse many times that modal, I will open a question .

RushVan's avatar

@yuche

Can't seem to get binding to work with date picker.

                            <div class="form-group col-md-4">
                                <label for="date">Date:</label>
                                <datepicker
                                        value="@ date ">  -->moustaches removed for post
                                </datepicker>
                            </div>

and

data: {
    date: '',
}   

components: {
    'datepicker': VueStrap.datepicker,
}

Selected date is not being picked up by date key.

jlrdw's avatar

What do you have against jquery? Do you like vuejs only because it's the latest preppie thing? I believe jquery is much better. I dread a few days from now if a new javascript package comes out. Suddenly everyone will drop vuejs like it's a plaque. Vue js causes too much over thinking in a web database application. Good job though.
Worse yet I dread it if a new PHP framework is suddenly announced, I just wonder how many laravel advocates would all of a sudden act like laravel never even existed.

mariaczi's avatar

@yuche - are you going to develop it futher? E.g. add new components like Time Picker or others?

nateritter's avatar

@Maskers!

I had that problem and the fix was setting a preliminary date. Irritating, but fixed it for me:

For instance:

data: function () {
    return {
        date: '01/01/1980'
    }
},   

components: {
    'datepicker': VueStrap.datepicker,
}
Previous

Please or to participate in this conversation.