VUE screen size and after resize is it possible to combine ?

"document ready" and "window.resize".

As you know, we want to develop websites that will work with all screens. Before coding the application, we need to create the main frame. Is it possible to combine the events I have mentioned ?

I want to combine these two events and get the screen width. Then I want to design for bootstrap's breakpoints. So I will have a responsive framework.

        data () {
            return {
                scsize: window.innerWidth, //ready default size
            };
        },

	//event listener component add and remove
        created() {
        window.addEventListener("resize", this.myEventResize);
        },
        destroyed() {
        window.removeEventListener("resize", this.myEventResize);
        },

            myEventResize(e) {
                this.scsize= window.innerWidth; // re-size and data update
            },

This works. But I'm not sure I'm doing it right. Because when I query it with "if" it only acts according to the default value. Whereas I want it to be alive.

Do we have to constantly parse these two events in order for screens to always work responsibly ?

Can't we build our code on it ?