Question

我在捕获事件然后调用本地方法时遇到问题。我尝试过使用箭头语法，绑定到＆＃39;这个＆＃39;以及设置＆＃39; self＆＃39;对于这个＆＃39;，但不管我做什么，我都不能从事件中调用this.notify（...）。我得到错误＆＃34; this.notify不是函数。＆＃34;这无疑意味着我无法跨越某些背景？

在我尝试从事件中调用它时，通知功能在各种条件下都可以正常工作。

这里没有什么神奇之处。 app.js加载总线（事件总线），vuex / store和Notifications，然后app.vue。

所以我通过商店发送事件，并且在这种情况下必须获得一个不相关的组件来调用商店中的变异，然后商店在另一个显示通知的不相关组件中运行一个函数。帮助赞赏。 -Thanks。

App.js

(...)
    import Notifications from 'vue-notification';
    import velocity from 'velocity-animate';
    Vue.use(Notifications, { velocity });

    import app from "./app.vue";

    const app = new Vue({
        el: '#app',
        store,
        Notifications,
        app,
        render: h => h(app)
});
(...)

组件A - 工作得很好。

 (...) 
 <b-btn v-on:click="$parent.showPokeNotice('display this nonsense text')"> My Arbitrary Text </b-btn>
 (...)

组件B - 但是当我使用事件通过商店（Vuex）进行路由时，上下文不是相同的。所以$ notify（）和this.notify（）都不可用。

    <template>
         (...)
         <notifications 
             group="workspace" 
             position="top center" 
             width="40%">
         </notifications>
         (...)
    </template>

    (...)
    mounted: function() {
    (...)

        /* Register Listeners for the Notification alerts */
        var self = this;
        Bus.$on('showPokeNotice', function (noticeText) {
            self.showPokeNotice(noticeText);
        });
    },

    (...)
    methods: {
    (...)
        showPokeNotice : function (noticeText) {
            this.notify({... params ...}); <---THIS IS THE PROBLEM CONTEXT
        }
    (...)
    }

因此，this.notify /（$ notify）在组件B中的Notifications组件中，但不是＆＃39;可从活动中获得。

错误：

[Vue warn]: Error in event handler for "showPokeNotice": "TypeError: Cannot read property 'showPokeNotice' of undefined"
(found in <Root>)

TypeError: Cannot read property 'showPokeNotice' of undefined ...

感谢。

Answer 1

ANSWER

因此，在组件的上下文中，我们使用

this.notify({...

但是，在回应事件时，我们使用：

this.$notify({...

因此，当使用事件调用全局变量时，显然存在一些范围（上下文）丢失。

我希望这能给别人带来价值......

通过调用本地方法

1 个答案: