Отмена / Отмена публикации Axios на компоненте Vue - PullRequest
1 голос
/ 07 мая 2019

У меня есть Vue Component, у которого есть список значений, когда вы выбираете эти значения, это изменяет выбранный массив, который в tern передается в конечную точку.

У меня есть проблема, если пользовательский спам щелкает эти значения, так как для каждого изменения создается отдельная запись, я хочу, чтобы, если пользователь выбирает другой элемент, то ожидающая публикация отменяется, поэтомуновое значение публикуется и обновляет конечную точку обоими выбранными элементами.

Однако у меня возникла проблема с прерыванием текущего запроса axios, я предоставил код ниже.Ошибок нет, запрос просто не отменяется.

export default {
    props: {
        endpoint: {
            default: '',
            type: String
        },
        parameters: {
            default: null,
            type: Object
        }
    },
    data: () => ({
        loaded: false,
        selected: [],
        save: [],
        data: [],
        cancel: undefined
    }),
    methods: {
        update() {

            const self = this;

            let params = this.parameters;
            params.data = this.selected;

            this.$root.$emit('saving', {
                id: this._uid,
                saving: true
            });

            if (self.cancel !== undefined) {
                console.log('cancel');
                this.cancel();
            }

            window.axios.post(this.endpoint + '/save', params, {
                cancelToken: new window.axios.CancelToken(function executor(c) {
                    self.cancel = c;
                })
            }).then(() => {
                this.$nextTick(() => {
                    this.loaded = true;
                    this.$root.$emit('saving', {
                        id: this._uid,
                        saving: false
                    });
                });
            }).catch(function (thrown) {
                if (window.axios.isCancel(thrown)) {
                    console.log('Request canceled', thrown.message);
                }
            });
        }
    }
}

В моем приложении Vue создан глобальный экземпляр Axios.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...