如何将封装的vue复用组件confirm绑定至vue原型示例？

本文共计882个文字，预计阅读时间需要4分钟。

首先，我们需要创建两个文件：`confirm.vue` 和 `confirm.js`。`confirm.vue` 将包含 DOM 结构和相关逻辑，而 `confirm.js` 将用于管理确认框的显示状态。

confirm.vuevue {{ text }}

.confirm { /* 确认框的样式 */}.con_box { /* 内容框的样式 */}.context { /* 文本内容的样式 */}

confirm.jsjavascriptimport ConfirmComponent from './confirm.vue';

export function createConfirm() { const confirmInstance=new Vue({ render: h=> h(ConfirmComponent), }).$mount(document.createElement('div'));

document.body.appendChild(confirmInstance.$el);

return { showConfirm(message) { confirmInstance.showConfirm(message); }, };}

这样，我们就创建了一个简单的确认框组件，它可以通过 `confirm.js` 中的 `showConfirm` 方法显示，并允许用户进行确认或取消操作。