Giải thích giúp e với! Thắc mắc về chức năng show modal của bootstrap trong vueJS

Chào mọi người.
Mình đang học VueJS và có thắc mắc sau mong mọi người giải đáp.
Mình có 1 danh sách list, và một form insert new (dạng modal popup).
Và vấn đề em muốn hỏi đang ở phần show modal. (e có sử dụng bootstrap ah).
Các bước em đang xử lý như sau ạ.

1. Click button New sẽ hiển thị form insert.
2. Nhập thông tin vào form, nhấn submit. modal sẽ ẩn đi và hiển thị loading ($('#id').modal('hide'));
3. Server validate và trả lỗi về nếu có.
4. Client nhận errors từ server, hiển thị lên modal. và gọi modal('show'), để show lại modal.

Lỗi của em đang gặp là ở dưới local, nó hoặt động ok.
Nhưng khi em triển khai trên server. thì gặp lỗi ở bước 4. sau khi modal đc show lên nó ngay lập tức bị ẩn đi. Mà em chưa hiểu lý do. Mong anh chị giải đáp.

$('#insertForm').modal('hide');
axios
        .post(url, data)
        .then((res) => {
            let data = res.data;
            if (data.status) {
                notify.success(data.message);
                this.form.reset();
                this.$emit('changeDetailList', data.data);
            } else {
                notify.error(data.message);
            }
        })
        .catch((err) => {
            this.form.errors.record(err.response.data.errors);
            $('#insertForm').modal('show');
        })
        .finally(() => {
            this.busy = false;
            common.hideLoading();
        });

P/s: em đã dùng 1 cách khác và xử lý đc rồi, nhưng vẫn còn lăn tăn về vấn đề em gặp trên server. mong anh chị giải đáp ạ.