Vuejs $emit 不会在回调时触发

2024-04-22

在下面的代码中:

export default {
    props: ['note'],
    methods: {
        remove(){
            NoteRepo.remove(this.note, (err) => {
                if (err) {
                    console.log('Should Fire')
                    this.$emit('alerted', {
                        type: 'error', 
                        message: 'Failed to remove note'
                    });
                }
            })
        }
    }
}

当调用删除函数时,控制台会记录“Should Fire”,但 $emit 事件不会被触发。如果我将 $emit 移到回调之外,如下所示:

export default {
    props: ['note'],
    methods: {
        remove(){
            this.$emit('alerted', {
                type: 'error', 
                message: 'Failed to remove note'
            });

            NoteRepo.remove(this.note, (err) => {
                if (err) {
                    console.log('Should Fire')
                }
            })
        }
    }
}

有用。我尝试过分配_this = this并用它来触发 $emit 但没有区别。

为什么 $emit 事件不会在回调中触发?


所以事实证明是 NoteRepo 中的某些内容导致了问题。特别是 firebase 事件回调。

constructor () {
        super();

        // Initialize Firebase
        Firebase.initializeApp({
            apiKey: "xxx",
            authDomain: "xxx",
            databaseURL: "xxx",
            storageBucket: "xxx",
            messagingSenderId: "xxx"
        });

        this.ref = Firebase.database().ref('notes');
        this.attachFirebaseListeners();
    }

    attachFirebaseListeners() {
        this.ref.on('child_added', this.onAdded, this);
        this.ref.on('child_removed', this.onRemoved); // Removing 'this' here seems to of fixed it.
        this.ref.on('child_changed', this.onChanged, this);
    }

我不确定到底出了什么问题,但现在似乎已经解决了。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Vuejs $emit 不会在回调时触发 的相关文章

  • 每次用户在地址栏中按 Enter 时,Firefox 插件都会执行某些操作

    我正在尝试编写一个扩展程序 用于监视每次有人在使用地址栏时按下回车键时的情况 步骤将类似于 用户在地址栏中输入一堆文本并按 Enter 键 我的插件启动并接收用户输入的内容 然后我的插件决定如何处理用户输入的字符串 我通过使用在步骤 2 中
  • 在 Javascript 中获取文本框的值

    我有这个html代码 table border cellpadding 3 cellspacing 0 tbody tr td Song td td td tr tbody table
  • 无法读取未定义错误的属性“匹配”

    我试图在 React JS 前端显示一些文本来代替个人资料图像 当它不可用时 基本上 我将当前客户名称传递给一个函数 该函数提取名称中所有单词的第一个字符 我能够仅显示名称 但是当我执行函数调用时 出现 无法读取未定义的属性 匹配 错误 并
  • Nest.js - 在猫鼬模式中创建索引

    如何使用 Nest js 在猫鼬模式中创建属性索引 我尝试添加索引作为属性选项 但索引尚未创建 Schema export class Schema extends Document Prop id string Prop required
  • 更改模板标签 <# {% {{ 等后,John Resig 的微模板出现语法错误

    我在使用 John Resig 的 Micro 模板时遇到了一些麻烦 谁能帮我解释为什么它不起作用 这是模板 以及发动机的改装部分 str replace r t n g split join t replace gt t g 1 r re
  • Node.js 中的 Azure Function 和共享文件

    我正在通过 Bitbucket CI 部署我的 Azure Functions 我可以在多个函数中引用共享目录中的文件 这很棒 但是 当我尝试更新我的共享代码并通过推送到主分支来部署它时 我可以看到文件在我的 Kudu 控制台中更新 但我的
  • 如何在 Angular 模板中嵌入 GitHub gist?

    角度忽略script其模板中包含标签 但加载 GitHub gist 需要它们 执行此操作的最佳做 法是什么 使用iframe 创造script动态标记 或者是其他东西 一种方法是创建一个iframe with script里面并在你希望你
  • 在 Node.js 中每 4 小时安排一次任务

    如何使用 Node js 中的 node schedule 安排任务在 4 小时后运行 目前我的代码如下 但它没有按预期响应 var schedule require node schedule var task schedule sche
  • Node.js 和代码优先

    我使用代码优先方法开发实体框架 现在我正在学习 Node js 我想知道是否有一种方法可以使用 Node js 和一些库来实现相同的代码优先方法 我正在考虑使用MySql作为数据库 你可以看看续集 http docs sequelizejs
  • 如何用方向键移动div

    我想使用 jQuery 用箭头键移动 div 所以右 左 下 上 找到了我想要完成的演示here http atomicrobotdesign com blog htmlcss move objects around the canvas
  • 在 Jest 测试中设置时刻时区

    我有 util 函数 它以特定的日期格式解析给定的日期 即 2019 01 28 然后使用momentJS检索当天的开始并将其转换为 ISO 日期格式 dates js import moment from moment export co
  • Javascript 警报/消息框中的欧元符号或其他实体

    有谁知道我如何在 javascript 警报窗口中显示欧元或其他 html 实体 alert u20AC HTML 实体字符查找 http leftlogic com lounge articles entity lookup
  • jquery 中 DOM 元素的手动垃圾回收是否可以提高浏览器性能?

    在性能范围内 删除不再需要的元素是否有意义 或者浏览器是否对代码中未进一步引用的 dom 元素执行自动垃圾收集 some element fadeOut 1000 function el el remove lt does this mak
  • mocha——手表和猫鼬模型

    如果我让 mocha 监视更改 每次保存文件时 mongoose 都会抛出以下错误 OverwriteModelError 无法覆盖Client模型一旦编译 我知道猫鼬不允许两次定义模型 但我不知道如何让它与mocha watch clie
  • ES6 模板文字可以在运行时替换(或重用)吗?

    tl dr 是否可以制作可重用的模板文字 我一直在尝试使用模板文字 但我想我就是不明白 现在我感到沮丧 我的意思是 我想我明白了 但 它 不应该是它的运作方式 或者它应该如何实现 它应该变得不同 我看到的所有示例 甚至标记模板 都要求 替换
  • 原型链、构造函数、继承

    我正在玩 javascript 原型 我是新手 所以我有一个小问题 我正在用这个article http mckoss com jscript object htm作为指导 我已经定义了产品和书籍 目的是什么Book prototype c
  • 更改哈希值而不触发 hashchange 事件

    我使用哈希来动态加载内容 为了使后退按钮正常工作 我正在捕获哈希更改 然而 有时我需要更改哈希值而不触发哈希更改函数 例如 当页面重定向到服务器端时 我需要在内容返回后更新哈希值 我想出的最佳解决方案是取消绑定 hashchange 事件
  • 如何始终将焦点保持在画布上?

    我一直在这个论坛寻找解决方案 但尚未找到 无论我在页面上的哪个位置单击 我都需要始终将焦点放在画布元素上 我有几个按钮 在每个 onclick 事件中我写 document getElementById canvas focus 这确实有效
  • 使用 JQueryUI Autocomplete 和 Meteor 的规范方法

    使用 Meteor 我想了解使用 JQuery UI 自动完成处理大量服务器端数据的最有效方法 我有两个工作提案 想听听关于差异的意见 以及是否有更好的方法来做同样的事情 使用发布 订阅 Server Meteor publish auto
  • Vuex store.watch 只接受 Vue routerguard 中的函数

    我正在尝试观察并等待 Vue 路由器防护从 Vuex 获取最终值 但它会抛出异常 vuex store watch 只接受一个函数 这是代码 const isAdmin get store getters user isAdmin unde

随机推荐