如何在没有lambda表达式的情况下调用Vue组件中的函数

您所在的位置:网站首页 vue引用打印组件 如何在没有lambda表达式的情况下调用Vue组件中的函数

如何在没有lambda表达式的情况下调用Vue组件中的函数

2023-04-01 18:28| 来源: 网络整理| 查看: 265

我使用的是Vue Js 2.6,并制作了这个组件:

Vue.component('confirmmodal', { template: '', data: function () { return { showModal: false, title: '', text: '', confirmMethod: null, dismissMethod: null, compiledTemplate: null }; }, methods: { initTemplate: function (result) { this.compiledTemplate = Vue.compile(result); //called from created return; }, show: function (t) { this.showModal = true; }, ok: function () { this.showModal = false; if (this.confirmMethod) { this.confirmMethod(); } }, cancel: function () { this.showModal = false; if (this.dismissMethod) { this.dismissMethod(); } } }, render: function (createElement) { if (this.compiledTemplate) { return this.compiledTemplate.render.call(this, createElement); } }, created: function () { site.apiGetHtml("/home/ConfirmModal/", null, this.initTemplate, null, null); modalhandle.$on('toggleConfirm', content => { this.title = content.title; this.text = content.text.replace('§', ''); this.confirmMethod = content.confirm; this.dismissMethod = content.dismiss; //this.$root.$options.components.confirmmodal.options.methods.show(content); this.show(); }); } });

也许这是一个很糟糕的实现方式,但是在我的ASP.NET项目中,我做了一些局部视图,加载到site.apiGetHtml函数中,在创建组件时编译到组件中。它工作得很好。

该组件在Chrome和其他支持ES6的浏览器中运行良好。但是我们的客户需要支持IE11 -问题来了,因为IE11不支持lambda-expression:

content => { this.title = content.title; this.text = content.text.replace('§', ''); this.confirmMethod = content.confirm; this.dismissMethod = content.dismiss; this.show(); }

当我将lambda-expression转换成一个函数时,'this‘变量在组件中找不到show-function (即使在Chrome中也找不到)。正如您所看到的,我试图通过this.$root.components作用域调用显示函数,但是看起来我没有初始化组件。什么都没发生。



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3