vue使用html2canvas

Posted 2023-03-30

参考技术A 首先我想要转成图片的是一个组件，但是直接在组件上使用ref 并且调用只会返回data:,此组件只会调用真正的dom，解决办法就是在外层套一个dom，引用组件
其次在使用时我想初始化时候就将页面转化为图片，放在mounted中返回也是data:,还没有解决办法 未完待续。。。

如何使用 Vue 3 并添加插件 Bootstrap-vue？

【中文标题】如何使用 Vue 3 并添加插件 Bootstrap-vue？

【英文标题】：How to use Vue 3 & Add Plugin Boostrap-vue?

【发布时间】：2020-12-13 15:25:42

【问题描述】：

我尝试使用 Vue 3，但我看起来无法再次使用 Vue.use(exampleplugin)。

我在生成 vue 创建项目后使用命令 vue add bootstrap-vue。并在插件 bootstrap-vue 警告代码中：

import Vue from "vue";

import BootstrapVue from "bootstrap-vue";
import "bootstrap/dist/css/bootstrap.min.css";
import "bootstrap-vue/dist/bootstrap-vue.css";

Vue.use(BootstrapVue);

输出警告终端：

./src/plugins/bootstrap-vue.js 中的警告

“在'vue'中找不到导出'default'（导入为'Vue'）

./node_modules/bootstrap-vue/esm/utils/vue.js 中的警告

“在'vue'中找不到导出'default'（导入为'Vue'）

这有什么问题？以及如何使用vue 3添加插件bootstrap-vue？

【问题讨论】：

相当肯定BootstrapVue isn't compatible with Vue 3。您可能应该坚持使用 Vue 2

你有没有设法解决这个问题？我有同样的问题，但对于不同的图书馆。在“main.js”中导入它并将 .use 链接到 createApp 调用不起作用。

【参考方案1】：

Bootstrap Vue 还没有为 Vue 3 做好准备。

为了回答您的部分问题，Vue 3 更改了实例化应用程序实例的方法，包括插件的注册方式。

例如...

import  createApp  from 'vue';
import Router from './router/Router';

createApp(/* options */)
  .use(Router)
  .mount('#app');

您可以在官方文档中阅读更多相关信息。

https://v3.vuejs.org/guide/instance.html

https://v3.vuejs.org/guide/migration/introduction.html

【讨论】：

还是这样吗？ bootstrap vue 与 vue 3 不兼容吗？

是的，Bootstrap-Vue 声明它们与 vue 2.6 兼容：bootstrap-vue.org