关于如何使用 bootstrap-vue-next 使用 toast 的任何想法?my-component.ts:从“vue”导入 { defineComponent };从 \'vue\' 导入 { ref };从“bootstrap-vue-next”导入 { useToast };
关于如何使用 bootstrap-vue-next 使用 toast 有什么想法吗?
我的组件.ts:
import { defineComponent } from 'vue';
import { ref } from "vue";
import { useToast } from 'bootstrap-vue-next';
export default defineComponent({
data() {
return {
abc: '',
}
},
setup() {
const toast = useToast()
return toast
},
async mounted() {
// do nothing
},
methods: {
async testToast() {
try {
this.show?.({props: {variant: 'success', title: 'Message', body: 'Toasted successfully!'}});
} catch (err) {
console.log(err)
this.show?.({props: {variant: 'danger', title: 'Message', body: 'Something went wrong!'}})
}
}
}
})
我的组件.vue:
<template>
<div class="my-component">
<BButton @click="testToast" variant="success">Click Me</BButton>
</div>
</template>
<script lang="ts">
import MyComponent from './my-component';
export default MyComponent;
</script>
上面的代码对我完全没用,非常感谢您的帮助。PS 此组件被注入到 app.ts 文件中,该文件包含为 App.vue 主组件编写的代码。
我在 qpopupedit 异步验证方面遇到了问题,我创建了一个 codepen。我认为它正在将返回布尔值转换为字符串。有人可以检查为什么它不起作用吗?我创建了一个 Codepen,你...
我遇到了 qpopupedit 异步验证问题,我创建了一个 codepen。我认为它正在将返回布尔值转换为字符串。有人能检查一下它为什么不起作用吗?
我创建了一个 Codepen 你可以查看
async function validatecalories (val){
errorCalories.value = true;
errorMessageCalories.value = 'async error';
return new Promise(function (resolve, reject) {
setTimeout(function (){
reject(false);
}, 300);
});
}