Использование ионного ToastController вне экземпляра vue - PullRequest
0 голосов
/ 14 июня 2019

Я пытаюсь использовать ToastController of Ionic вне экземпляра vue;я создал отдельный файл действий, который будет загружен в сам экземпляр vue, который обрабатывает запрос.Во время этого запроса он делает некоторые проверки, и я хотел бы бросить тост, когда что-то произошло.В экземпляре vue я мог бы сделать это. $ Ionic.toastController.create (), который работает нормально, но в этом другом файле нет доступного экземпляра vue, поэтому я попытался импортировать туда ToastController, но не смог сделать эту работу.

Кто-то, кто может указать мне правильное направление с этим?

Я уже пробовал несколько вариантов и искал в интернете это;Поскольку ionic 4 с vue.js все еще находится в альфа-режиме, поддержка в настоящее время очень мала.Я бы также использовал экземпляр @ modus / ionic-vue, который работает лучше, чем оригинал от самого ionic в данный момент

Фактический код будет вызываться во время вызова this. $ Store.dispatch (RESERVATION_REQUEST)см. пример:

import { ToastController } from '@modus/ionic-vue'
import axios from 'axios'

const state = {
    status: '',
    classes: {},
}

const getters = {
    //
}

const actions = {
    [RESERVATION_REQUEST]: ({ commit, dispatch }, data) => {
        return new Promise(( resolve, reject ) => {
            axios({ url: 'reservation/create', data: { lesson: data.lesson, date: data.date, team: data.team }, method: 'POST' })
                .then(response => {
                    ToastController.create({
                        duration: 2000,
                        header: 'Confirmation',
                        message: 'Success',
                        position: 'top',
                        showCloseButton: true,
                        closeButtonText: 'Ok',
                    }).then(toast => toast.present());
                    resolve(response)
                })
                .catch(error => {
                    ToastController.create({
                        duration: 2000,
                        header: 'failed',
                        message: error.toString(),
                        position: 'top',
                        showCloseButton: true,
                        closeButtonText: 'Ok',
                    }).then(toast => toast.present());
                    reject(error)
                });
        });
    },
}

const mutations = {
    //
}

export default {
    state,
    getters,
    actions,
    mutations,
}

Приведенный выше код будет называться так:

toggleReservation(lesson, date) {
    const team = this.$store.getters.getCurrentId;
    this.$store.dispatch(RESERVATION_REQUEST, { lesson, date, team });
}

Было бы неплохо, если бы кто-то мог помочь мне с этим;в течение нескольких дней я чувствую, что я на правильном пути, но пока не могу найти решение.

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