我正在尝试使用Bootstrap-Vue中的动态吐司。这是我正在尝试做的事情：
<template>
<b-button @click="handleClick(education)"></b-button>
</template>
<script>
import { notificationToast } from "@/components/NotificationToast";
export default{
methods:{
handleClick(){
notificationToast(true);
}
}
</script>
NotificationToast.js
import Vue from "vue";
import { BVToastPlugin } from "bootstrap-vue";
Vue.use(BVToastPlugin);
let notificationToast = (append = false) => {
this.$bvToast.toast(`This is toast`, {
title: "BootstrapVue Toast",
autoHideDelay: 5000,
appendToast: append,
});
};
export { notificationToast };
每当我单击按钮时，它就会显示错误：
TypeError：无法读取未定义的属性“ $ bvToast”
就像在文档中提到的那样，我导入了BVToastPlugin，但问题仍然存在。该怎么办？提前致谢。
在模块中，this关键字不引用Vue组件。最简单的解决方法可能是进行第二个参数传递并从组件传递上下文：
let notificationToast = (vm, append = false) => {
vm.$bvToast.toast(`This is toast`, {
title: "BootstrapVue Toast",
autoHideDelay: 5000,
appendToast: append,
});
};
并这样称呼它：
notificationToast(this, true);
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句