如何从另一个函数访问全局函数(Vue.prototype.myFn)? [英] How to access a global function (Vue.prototype.myFn) from another function?
本文介绍了如何从另一个函数访问全局函数(Vue.prototype.myFn)?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我在一个 nuxt.js 项目中并尝试创建全局函数，但我遇到了这个错误:
无法读取未定义的属性$toggleBodyClass"这是我的代码(插件/globals.js):
从'vue'导入Vue；Vue.prototype.$toggleBodyClass = (addRemoveClass, className) =>{const elBody = document.body;if (addRemoveClass === 'addClass') {elBody.classList.add(className);} 别的 {elBody.classList.remove(className);}};Vue.prototype.$setModalBackdrop = () =>{this.$toggleBodyClass('addClass', 'modal-open');//** 如何使这个工作?**};当我在我的组件 (components/myComp.vue) 中使用它时，它工作得很好:
<div><button @click="handelClick">Toggle Class</button></模板><脚本>导出默认{方法: {句柄点击(){this.$toggleBodyClass('addClass', 'modal-open');},},};
请帮忙，谢谢.
解决方案
只需更改您的代码
this.$toggleBodyClass到
Vue.prototype.$toggleBodyClassI am on a nuxt.js project and trying to create global functions and I am this error:
Cannot read property '$toggleBodyClass' of undefined
Here is my code (plugins/globals.js):
import Vue from 'vue';
Vue.prototype.$toggleBodyClass = (addRemoveClass, className) => {
const elBody = document.body;
if (addRemoveClass === 'addClass') {
elBody.classList.add(className);
} else {
elBody.classList.remove(className);
}
};
Vue.prototype.$setModalBackdrop = () => {
this.$toggleBodyClass('addClass', 'modal-open'); // ** How to make this work? **
};
This work just fine when I use it in my component (components/myComp.vue):
<template>
<div>
<button @click="handelClick">Toggle Class</button>
</div>
</template>
<script>
export default {
methods: {
handleClick() {
this.$toggleBodyClass('addClass', 'modal-open');
},
},
};
</script>
please help, thanks.
解决方案
Just change your code from
this.$toggleBodyClass
to
Vue.prototype.$toggleBodyClass
这篇关于如何从另一个函数访问全局函数(Vue.prototype.myFn)?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
