vue-component 相关问题

Component是一个强大的Vue功能，允许扩展基本HTML元素以封装可重用代码。

我最近开始开发一个使用 vite 运行的 Vue 3 应用程序，我正在尝试重构目录，以便可以将组件和相关子组件分组到文件夹中。我现在...

vue.js vue-component vuejs3 vite rollup

回答 3 投票 0

我有一个按钮当我点击复制时 copyImageLinkText({ mouseenter, mouseleave }, e) { this.showCopiedText = !this.showCopiedText navigator.clipboard.writeText(this.imageLink) 清除超时(

javascript vue.js vuejs2 vue-component copy-paste

回答 4 投票 0

Vue：如何在每次组件递归执行时捕获一个值？

要求：每次组件递归执行时，我想将对象中的值捕获到数组中。问题陈述：当组件递归执行时，我可以将值推送到每个

javascript typescript vue.js vuejs3 vue-component

回答 1 投票 0

无法解析组件：google-pay-button

我正在尝试使用 google-pay-button 在 vue js 中通过 Gpay 进行支付集成。但我收到错误 - 无法解析组件：google-pay-button 我的代码 - 我正在尝试使用 google-pay-button 通过 vue js 中的 Gpay 进行支付集成。但我收到错误 - 无法解析组件：google-pay-button 我的代码- <google-pay-button environment="TEST" v-bind:button-type="buttonType" v-bind:button-color="buttonColor" v-bind:existing-payment-method-required="existingPaymentMethodRequired" v-bind:paymentRequest.prop="{ apiVersion: paymentRequest.apiVersion, apiVersionMinor: paymentRequest.apiVersionMinor, allowedPaymentMethods: paymentRequest.allowedPaymentMethods, merchantInfo: paymentRequest.merchantInfo, transactionInfo: transactionInfo, callbackIntents: callbackIntents, }" v-on:loadpaymentdata="onLoadPaymentData" v-on:error="onError" v-bind:onPaymentAuthorized.prop="onPaymentDataAuthorized"> </google-pay-button> <script> import "@google-pay/button-element"; export default { ... } </script> 我期望应该显示 Google pay 按钮，但它显示错误。这是一个警告。尽管如此，该元素仍然需要生成。错误的原因是 @google-pay/button-element 不是 Vue 组件，但它们正在寻找名为 <google-pay-button> 的元素来显示按钮。 Vue.js 旨在辅助开发，因此它表明 <google-pay-button> 是一个未声明的组件，确认您是否打算以这种方式使用它。这些特殊命名的元素可以放入例外列表中。我将演示如何使用 Vite 来做到这一点。 import { defineConfig } from "vite"; import vue from "@vitejs/plugin-vue"; // https://vitejs.dev/config/ export default defineConfig({ plugins: [ vue({ template: { compilerOptions: { // consider any tag with a dash as a custom element isCustomElement: (tag) => tag === 'google-pay-button', // can write any condition here, the key is to cover all your custom components, even if it's as simple as tag.startsWith("google-pay-") or any other }, }, }), ], });

vue.js vue-component google-pay

回答 1 投票 0

如何从 javascript/typescript 模块文件（导入/导出）访问 Vuex 存储？

我有一个vue应用程序。如何从 javascript/typescript 模块文件（导入/导出）访问商店？例如，我创建了导出状态、操作、突变的 auth-module。导出常量...

javascript typescript vue.js vue-component vuex

回答 2 投票 0

在Vue中处理链表

一个简单的数组可以在 Vue 中渲染如下：有没有一种简单的方法可以实现...

vue.js vue-component

回答 3 投票 0

Vue 3 的断点/响应式插件

使用 Vue 3 构建企业级应用程序，不幸的是我还没有找到任何合适的插件来使应用程序具有响应能力。虽然有一些旧插件可以与 Vue 2 配合使用，但不能...

vue.js vue-component vuejs3

回答 2 投票 0

在Vue3中定义和重用内联组件

是否可以在 Vue3 中内联定义一个“子组件”，它可以在同一个 .vue 文件/组件中重用，但无需实际定义新的 .vue 文件（即不定义此子组件）

javascript vue-component vuejs3

回答 3 投票 0

如何在 Vuetify 中重置表格的页面选项？

当我在分页的第 2 页时我的选项看起来像这样然后，我创建一条记录，要求我在表上调用 API 来 updateData()。我想将我的分页重置回...

vue.js vuejs2 vue-component vuetify.js

回答 1 投票 0

如何在Vue.js中onclick动态切换两个图片

我正在尝试在 Vue.js 中单击时切换图像。我的代码无法正常工作，但这就是我想要实现的目标：加载时图像是黑色的，单击/选择图像后，图像会切换并变成...

javascript typescript vue.js vue-component dynamic-programming

回答 1 投票 0

如何将选择事件添加到自动完成组合框？

我有这个组合框 @change 调用 API + 填充列表 - 完成 ✅ @select doSomething() - 未完成 ❌ 我很难检测出选择了什么。前任。如果我选择“马萨诸塞州”我想要...

vue.js vuejs2 combobox vue-component vuetify.js

回答 2 投票 0

如何按特定顺序加载vuejs组件？

我有一个父组件，其中包含两个子组件。两个子组件之一将通过 axios 调用将数据存储在数据库中。第二个子组件将需要排队...

vue.js vue-component

回答 3 投票 0

我正在使用vue2.7.0来封装组件。我想在组件中使用侦听器或 $listeners，但我得到了未定义

从“vue”导入{defineComponent，ref，onMounted}；导出默认定义组件（{ 名称：“LbTab”，道具： { 标签：{ 类型：数组，默认...</desc> <question vote="0"> <pre><code><script> import { defineComponent, ref, onMounted } from "vue"; export default defineComponent({ name: "LbTabs", props: { tabs: { type: Array, default: () => [], }, }, setup(props, { emit, attrs, listeners }) { const active = ref(); onMounted(() => { active.value = props.tabs[0]?.name; }); const handleInput = (val) => { active.value = val; }; const isComponent = (tab) => { return typeof tab.content === "object"; }; console.log(listeners); //undefined return () => ( <el-tabs {...{ attrs, ...listeners }} value={active} onInput={handleInput} > {props.tabs.map((tab, index) => ( <el-tab-pane label={tab.label} name={tab.name} key={index}> {isComponent(tab) ? <tab.content /> : tab.content} </el-tab-pane> ))} </el-tabs> ); }, }); </script> </code></pre> 听众未定义，这是错误的 我使用**vue2.7.0 **来封装组件。我想在组件中使用侦听器或 $listeners，但我得到了未定义 vue3.0监听器和attrs合并，2.7应该做什么？ </question> <answer tick="false" vote="0"> 考虑使用 <pre><code>getCurrentInstance()</code></pre> 访问当前 Vue 实例（包括父组件监听器）。 文档： <a href="https://v3.ru.vuejs.org/api/composition-api.html#getcurrentinstance" rel="nofollow noreferrer">https://v3.ru.vuejs.org/api/composition-api.html#getcurrentinstance</a> <pre><code>getCurrentInstance()</code></pre>源代码： <a href="https://github.com/vuejs/vue/blob/main/src/v3/currentInstance.ts" rel="nofollow noreferrer">https://github.com/vuejs/vue/blob/main/src/v3/currentInstance.ts</a> 用途： <pre><code>import { defineComponent, getCurrentInstance } from 'vue' export default defineComponent({ setup () { const thisInstance = getCurrentInstance() function eh () { // console.log(this.$listeners) console.log(thisInstance.proxy.$listeners) } return {} } }) </code></pre> 它可以在 vue 2.7 中运行，我相信它也可以在 vue 3 中运行，尽管 vue 3 有自己的 <pre><code>attrs</code></pre>。 更多关于<pre><code>getCurrentInstance()</code></pre>的信息：<a href="https://stackoverflow.com/questions/72209080/vue-3-is-getcurrentinstance-deprecated">Vue 3：getCurrentInstance() 是否已弃用？</a> 相关： <a href="https://stackoverflow.com/questions/46706737/check-if-a-component-has-an-event-listener-attached-to-it">检查组件是否附加了事件侦听器 - 堆栈内存溢出 </a> </answer>

vuejs2 vue-component jsx

回答 0 投票 0

在 Vue 3 网站中运行已编译的 Vue 2 应用程序

我想知道是否有人有在 Vue 3 网站内运行已编译的 Vue 2 应用程序的策略。我有一系列用 Vue 2 编写的小部件，我正在尝试在由 Vue3 和它提供支持的网站中运行

vue.js vuejs2 vuejs3 vue-component

回答 1 投票 0

是否可以从全局注册表中全局删除一个vue组件？

我想在运行时从 Vue 中删除之前使用 Vue.component(name, {...}) 注册的组件，这可能吗？我们正在实时创建许多组件

vue.js vue-component

回答 4 投票 0

当父组件更新 props 值时，Vuejs 子组件 props 不更新

我有一个父组件和子组件设置，每当我将对象属性传递给子组件时，它只会获取初始值，并且当从父组件进行更改时不会进一步更新...