在将Vue生成的web组件加载到也是Vue应用程序的主机/父应用程序时证明错误
当将Vue生成的web组件加载到Vue应用程序的主机/父应用程序时，出现错误的可能原因有多种。以下是一些可能的原因和解决方法：
- 版本不匹配：确保Vue组件和主机/父应用程序使用相同的Vue版本。不同版本之间的API和语法可能会有所不同，导致加载错误。
- 依赖项冲突：检查组件和主机/父应用程序的依赖项，确保它们之间没有冲突。特别是检查Vue及其相关库的版本，以确保它们兼容。
- 组件引入错误：检查组件的引入方式是否正确。确保在主机/父应用程序中正确引入组件，并使用正确的组件名称。
- 组件注册问题：确保组件在主机/父应用程序中正确注册。在Vue应用程序中，组件需要在使用之前进行注册，可以使用Vue.component()方法或在组件选项中进行注册。
- 路径错误：检查组件的路径是否正确。确保组件的路径与实际文件路径相匹配。
- 缺少依赖项：检查组件所需的依赖项是否完整。有时组件可能依赖于其他库或插件，确保这些依赖项已正确引入。
- 兼容性问题：某些组件可能依赖于特定的浏览器功能或API，而主机/父应用程序可能不支持这些功能。在这种情况下，需要进行兼容性检查，并根据需要进行适当的处理。
- 错误处理：在加载组件时，确保在代码中实现适当的错误处理机制。可以使用try-catch语句捕获加载组件时可能出现的错误，并提供相应的错误提示或处理方式。
总之，当将Vue生成的web组件加载到Vue应用程序的主机/父应用程序时，需要确保版本匹配、依赖项正确、引入方式正确、注册正确、路径正确、依赖项完整、兼容性检查和错误处理等方面的注意事项。根据具体情况进行排查和解决，以确保组件能够成功加载和运行。
（以上答案仅供参考，具体解决方法可能因实际情况而异。腾讯云相关产品和链接地址请自行查阅腾讯云官方文档或网站。）
相关·内容
我有一个Vue Cli 3生成的web组件/自定义元素，它使用Vuetify。我有一个家长/主机Vue应用程序，它也在使用Vuetify。当自定义元素加载到主机应用程序中时，我会收到一堆Type错误，如截图所示。例如类型错误:无法读取未定义的属性主题。 这似乎是一个Vuetify问题。在Vue CLi自定义元素及其宿主应用程序中使用Vuetify的正确架构是什么？ 目前，我在父元素中有Vue.js脚本标记，供自定义元素使用。并且Vue会像往常一样导入到Vue应用程序中。脚本标记之所以存在，只是因为自定义元素需要它。我在这两个版本中也都包含了Vuetify。web组件正在使用vuetify插件
浏览 26提问于2019-04-22得票数 1
回答已采纳
1回答
我想问一些关于本地主机之间和部署到web主机服务器之后的vue路由器行为的细节和良好的解释。首先，这是我的示例路由器代码
import Vue from 'vue'
import Router from 'vue-router'
...
Vue.use(Router)
export default new Router({
mode: 'history',
base: process.env.BASE_URL,
routes: [
...,
{
path: '/H
浏览 0提问于2021-02-04得票数 1
回答已采纳
我对Vue非常陌生，负责创建一些Vue小部件，这些小部件可以嵌入到两个现有的非Vue遗留web应用程序中。我们的想法是创建这些小部件的库，然后将其嵌入到遗留应用程序中，并最终将整个应用程序迁移到Vue。
我一直在寻找最好的前进之路，我有点困惑。我想这些是我的问题：
我需要在这里考虑Web组件吗?还是小部件可以是我们嵌入的实际Vue应用程序？
如果小部件应该作为Web组件创建，那么使用vue/web组件包装器还是使用vue自定义元素库有什么区别吗？
无论我们选择哪个选项，我们都能充分利用您在任何普通的Vue应用程序中使用的特性-- Vue路由器、用于状态管理的Vuex
浏览 3提问于2021-02-10得票数 1
回答已采纳
1回答
这确实是一个代码风格的问题，尽管我使用Vue.js来开发我的前端，我用Vue术语表示它。
我正在使用Vue.js开发一个相当复杂的web应用程序。即使使用单个文件组件，我也会发现我的一些组件(例如，CustomerEditor )变得越来越大，越来越难以编辑。现在，我来自Java背景(实际上是最近几年的Grails/Groovy)，我的本能总是将可能在多个地方可用的任何东西隔离到自己的类中，以便尽可能地保持干燥原则。
我一直在用Vue.js做这件事，把事情分解成更小的组件，在那里我看到了重用的可能性。即便如此，其中一些文件仍然相当大。所以现在我要考虑一些我从未真正做过的事情，把一些组件分成更小
浏览 5提问于2017-11-25得票数 4
在VueJS中，是否有多个单个文件组件(作为父-子)，每个都是嵌套在根实例中的vue实例？我之所以有这个假设，是因为每个组件都可以具有相同的属性，如data、methods、template、生命周期挂钩(mounted、created等)，类似于根Vue实例，或者说类似于非证监会设置中的vue实例。
在我看来，任何web包+ vue -加载器单文件组件设置都是作为JS对象导出并导入到父组件中的嵌套对象，即子组件嵌套在父组件中，父组件嵌套在单个根vue实例中。
基本上，简单地说，只有一个根实例，而证监会是嵌套对象。正如在下面链接的css-技巧文章中所写：
应用程序中可以有多个实例。通常，我们
浏览 2提问于2019-03-19得票数 0
回答已采纳
1回答
我试图根据这个指南显示日期diffForHumans：
因此，我试图以这种方式将DayJS作为组件加载到我的VueJS应用程序中：
<script src="{{ asset('/vendor/vuejs/vue.js') }}" type="text/javascript"></script>
<script src="{{ asset('/vendor/vue-dayjs/dayjs.min.js') }}"></script>
<script type=&
浏览 2提问于2021-01-11得票数 1
回答已采纳
对于Vue.js 2中的默认子路由，我有一个问题。
当我最初访问本地主机/清单时，它将正确地加载index.vue和map.vue。
当我使用路由器链接导航到本地主机/列表/1，然后使用路由器链接返回到本地主机/列表时，它仍然加载show.vue模板。这不应该发生吗？
我没有导航警卫或任何应该干扰的东西。有什么可以纠正的吗？
我的路线：
window.router = new VueRouter({
routes: [
...
{
path: '/listings',
name: 'listing.index',
浏览 3提问于2016-11-22得票数 25
回答已采纳
通过运行以下命令，我试图使用vue cli 3创建一个web组件
vue-cli-service build --target wc --name wc-demo 'src/App.vue'
我面临的问题，加载字体和材料图标内的网页组件。
我正在导入roboto-font.scss和material-icon.scss在App.vue的样式标签中，这是用于创建web组件的条目。
<style lang='scss'>
// @import url('https://fonts.googleapis.com/css?family=Roboto:
浏览 0提问于2020-01-28得票数 5
2回答
我正在使用以下命令构建一个web组件：
vue-cli-service build --target wc --name my-element 'src/components/mycomponent.vue'
我想在这个组件的内部使用Vuetify。如何将其添加到mycomponent.vue，以便在组件的阴影根中进行作用域？
该组件将被动态加载到用其他框架/样式构建的应用程序中。我希望web组件能够使用，例如，v-btn、v-layout等。
谢谢你，唐尼
浏览 1提问于2019-04-02得票数 4
回答已采纳
2回答
我正在使用Vue.extend手动地将一个组件挂载到一个动态元素，如下所示：
import Vue from 'vue';
import MyComponent from 'MyComponent.vue';
const MyComponentConstructor = Vue.extend(MyComponent);
const MyComponent = new MyComponentConstructor({
propsData: {
foo: 123,
},
}).$mount('#mount-point'
浏览 1提问于2017-06-09得票数 11
回答已采纳
所以我在做一个选择，当你选择一个选项时，它运行一个函数。问题是，我的navbar.vue中的选择和函数都在index.vue中。
函数需要在index.vue中，因为它从我的数据库收集产品列表，并将它们加载到我的HTML中。
我是否可以在index.vue中从navbar.vue运行函数，或者在navbar.vue中运行相同的函数，但将输出发送给index.vue？
下面是一个如何更好地理解这一问题的方案：
When option selected Navbar.vue --> Runs changeCountry function in index.vue
或
When option
浏览 2提问于2020-07-11得票数 0
回答已采纳
我正在尝试在Vue中构建一个前端web应用程序。在我的一个组件中，它呈现一个表，而我正在尝试使用子组件来填充一些表数据。子组件在表体表行的for循环中。 ParentComponent.vue： <table>
<thead>
<tr>
<th>Header 1</th>
<th>Header 2</th>
<th>Header 3</th>
<th>Header 4</th>
</tr>
</thea
浏览 20提问于2020-08-23得票数 0
回答已采纳
我遇到了一个问题，我通过cookies解决了它，但我想在没有cookies的情况下解决这个问题。我有一个叫做app-header的组件，还有一个叫做outmodal的组件。现在，我的第一个Vue实例需要组件app-header。
var vue = new Vue({
el : "html",
data : {
title : "Site Title",
description : "description of page",
keywords : "my
浏览 0提问于2015-08-03得票数 32
回答已采纳
2回答
我有一个具有一个方法的组件，我在创建时触发它。它使用的是vue-select，但这个组件的用途应该与我的问题无关。
<template>
<v-select :on-change="onchangecallback"></v-select>
</template>
<script>
import Vue from 'vue'
import vSelect from 'vue-select'
Vue.component('v-select'
浏览 1提问于2017-11-04得票数 1
我能够构建vue web组件并将其加载到其他页面中，但是我无法找到如何正确地包含UI框架的文档。web组件似乎在shadowDOM下，使用样式标记导入css将无法工作。
(在模板中添加CDN链接，并应用样式)
任何关于任何框架的提示，Vuetify或Ant设计或尾风CSS都将不胜感激。
类似问题：
浏览 4提问于2022-02-14得票数 2
回答已采纳
我使用@vue/vli 4.1.1和单个文件组件。我的应用程序的简化结构如下所示：
src
├── App.vue
├── assets
├── components
│ ├── PrintRecipe.vue
│ └── Recipe.vue
└── main.js
在配方组件中，我想包含一个打印按钮及其功能，就像在PrintRecipe组件中实现的那样。当按下按钮时，应打印来自配方组件的#recipe元素。
下面是Recipe.vue的虚拟版本：
<template>
<div>
<div id="other-conte
浏览 0提问于2020-04-04得票数 1
回答已采纳
2回答
背景
我试图在AEM中制作一个动态导航组件。目前，我一直试图在文档和网上寻找信息，以帮助我，但一直未能找到多少。
我的应用程序将vue组件加载到AEM中，因此前端由VUE控制，数据通过道具传递。
我想把这些页面的页面和子页面传递到vue组件中，这样我就可以为任何链接创建一个带有下拉导航的动态导航。
示例
目前，我找到了一种使用java类加载根页面链接的方法。我就是这样做的
package services.agro.something.core.models;
import java.util.*;
import java.util.Iterator;
import com.day.cq.w
浏览 1提问于2018-05-19得票数 0
1回答
我不知道为什么会发生这种情况，因为我的方法(父方法和子方法都在被调用)，但是实际的数据没有被传递，即使当我试图传递一个简单的字符串时，当我从从emit接收数据的父服务器记录数据时，数据也是“未定义的”:(
有人能帮我吗?或者解释一下？
我的应用程序在dom中是这样呈现的(这都是html注入的一部分，而不是vue-cli)。
<div id="app">
<div>
<b-button v-b-modal.modal-1>upload files</b-button>
<b-modal id=
浏览 2提问于2020-06-03得票数 4
回答已采纳
上下文:该应用程序目前运行在一个码头容器上。总共有三个集装箱，它们都连接在同一个网络上。-MariaDB -Flask应用程序-Vue应用程序(Not-16-buster)
当试图从我的烧瓶后端调用api时，我从axios获得了这个错误：
但是，当我复制url并尝试curl (从vue容器的终端)时，它就像一种魅力。
当我在本地的机器上运行所有的东西时，没有观察到这样的问题。
这是应用程序的vite.config.js文件。
import { fileURLToPath, URL } from 'node:url'
import { defineConfig } fr
浏览 1提问于2022-10-27得票数 0
，可以在Vue (v3)中构建组件，并将它们打包为，以便与任何框架一起使用，或者完全不使用。
正如我已经发现的，Vue组件和Web组件的设计模型之间的差距可能会使这个复杂的，有时甚至是一个直截了当的坏主意(在什么时候，直接构建完全本地组件会更好、更易于维护？)但让我们先假设一下这里是必要的。
我的问题是，在Vue构建的Web组件上(向父节点)公开类似函数的接口的最佳方法是什么？
Vue文档讨论通过道具/插槽传递反应性数据，以及从组件中发布CustomEvents，但我没有看到从外部接收函数调用(或者说是事件)。据我所知，这是一个相当有力的假设，即应用程序/页面其余部分的数据和事件流以非常“Vu
浏览 5提问于2022-03-03得票数 1
回答已采纳
几天来，我一直在尝试使用vue-路由器包，却不知道它是如何工作的，这有点让我抓狂。
我的问题是:我想使用VueJS制作一个单一的页面应用程序，而且我已经采用了vue-路由器包，因为它是VueJS开发团队正式支持的路由包。我读过很多“入门”文章，很多文章都是从像这样硬写模板开始的：
const Foo = { template: '<div>foo</div>' }
但是，由于我并不真正喜欢在这两个引号之间编写我的整个模板，所以我搜索了一种将模板写入文件的方法，然后将文件的内容加载到JS变量中。似乎可以将模板写入.vue文件，然后使用以下方法将它们加载到变
浏览 7提问于2017-11-05得票数 0
回答已采纳
1回答
可以从"parent element“调用导入元件中的函数吗？因为我想在我的应用程序中包含一些模块，并在我的应用程序中动态显示它们。但是，如果我在主App.vue文件夹中导入一个像Header这样的组件，它将识别主App.vue文件夹中的函数。
App.vue示例
<template>
<div>
<div class="m-grid m-grid--hor m-grid--root m-page">
<!-- <loader></loader> -->
浏览 7提问于2018-03-04得票数 1
回答已采纳
我的Vue应用程序中有以下项目结构：
components/
article/
AppList.vue
common/
AppObserver.vue
NoSSR.vue
layout/
AppFooter.vue
AppHeader.vue
ui/
AppButton.vue
AppList.vue
pages/
ArticlePage/
index.vue
ArticleTit
浏览 1提问于2020-02-28得票数 1
回答已采纳
1回答
我面对的是Vue的行为，我不明白。我正在使用组件之间的路由。
methods: {
redirectToLogin() {
this.$router.push("/login");
},
redirectToRegister() {
this.$router.push("/register");
}
}
因此，当加载应用程序时，路由登录组件，成功登录，然后用上面的方法登录到组件。之后，当我再次尝试路由登录时，不会呈现login组件，但是路
浏览 2提问于2019-09-17得票数 2
所以我在Vue开发了应用程序。在组件之间发送和接收数据时，我有问题。$dispatch/$broadcast和$emit/$on已经试过了，但现在还在工作。我想把选定的active_club从ClubSelection.vue发送到vue_main.js。
Vue版本: 2.0.3
我的应用程序结构：
vue_main -主Vue文件
HeaderElement.vue (子弟of vue_main)
ClubSelection.vue ( of HeaderElement)
需要将active_club从ClubSelection发送到vue
浏览 2提问于2016-10-27得票数 1
2回答
Vue.js将子组件导入组件
、、、、
今天，我正在制作一个todo web应用程序，但现在我想在我的Todolist组件中导入一个Todolist。我的组件：
App (家长)-托多(儿童)
错误：
24:5错误"Todo“组件已注册，但未使用vue/无未使用组件
码
托多尔人
<template>
<!-- TEMPLATE FOR THE TODOS -->
<div v-for="(todo) in todos" :key="todo.id">
<Todo
:todo="todo.text"
浏览 8提问于2021-02-12得票数 1
回答已采纳
我正在尝试创建一个自定义的Vue工具提示指令，该指令创建一个组件并将其渲染/挂载到应用程序的根元素。
目前，它正在按照应该的方式将tooltip组件挂载到mouseenter上，但并没有在mouseleave上销毁它。
稍后，我将获取指令绑定到它的元素ClientRect，并应用样式来定位工具提示。
下面是我的指令代码：
import Vue from 'Vue';
import tooltip from '../../views/components/tooltip/tooltip.vue';
export default {
bind() {},
浏览 6提问于2017-07-11得票数 1
回答已采纳
1回答
当props是一个数组时，可以从子组件中修改父属性：
Vue.component('search-box', {
template: '#search-box-template',
props: ['who']
})
var vm = new Vue({
el: '#root',
data: {
who: ['a', 'b']
}
})
<script type="text/javascript" src="https://cdnjs.c
浏览 2提问于2017-06-08得票数 3
回答已采纳
我正在创建一个Vue3 web应用程序，我想知道从父组件到嵌套组件(更具体地说，从父组件到子组件)传递数据的最佳方法是什么。
假设我有这样的模式：
Card
|
|
CardHeader CardBody
|
|
BodyHeader BodyParams BodyResponse
我想知道把数据从卡片传送到BodyHeader、BodyParams和BodyResponse的最佳方法。
在Card Component上，我将从API中获取一些
浏览 3提问于2022-11-08得票数 -1
回答已采纳
2回答
我有一个用Nuxt构建的SSR应用程序。我使用renderRoute来渲染Vue文件，因为我需要向客户端发送数据。一切正常，但是静态图像没有加载到我的应用程序中。我使用以下代码在我的vue文件中插入图像。
<img src="~assets/img/picture.png">
浏览 5提问于2020-06-03得票数 1
我有一个托管了几个工具的web应用程序。例如docx到pdf，pdf到docx等。每个都是应用程序中的一个vue模块文件。 当用户转到docx- to -pdf工具，使用dropzone上传文件时，服务器的文件管理器将生成一个uuid (我称之为模块会话id)，并将其用作目录名，以放置上传的文件并将该uuid返回给浏览器。然后，当用户单击“转换”时，uuid将与“转换”命令一起发送，服务器将执行转换，并允许用户下载转换后的文件。 这很好用，直到我有了一个名为combine-pdf的工具，并在页面上有了两个dropzone。当我同时上传dropzone1中的file1和dropzone2中的f
浏览 32提问于2020-03-24得票数 0
我正在尝试在我的网站样板中实现Vue，它使用树枝模板在Wordpress或Craft上运行。样板使用在页面之间进行转换，同时只加载更改后的内容。目前，我正在将我的所有反应元素作为单独的Vue组件。其中一些是通过“交换”内容加载到应用程序中的。
因此，在下面的设置中，我在#app中运行了一个Vue应用程序，它在运行时编译，它有一个header和一个footer组件。Swup处理#swup中的内容，因此当用户单击链接时，这一点会发生变化。所以有时它可能有纯文本内容，但有时它有一个slider组件。
<div id="#app">
<header><
浏览 2提问于2020-02-13得票数 1
2回答
我正在使用vue-cli 3和--target wc选项创建一个Vue web组件。我还需要组件来使用vue-i18n插件，它需要将一些选项传递给主Vue实例，如下所示：
new Vue({
i18n: new VueI18n({ ... ])
...
})
在普通的Vue应用程序中，这很好，因为我控制主Vue实例的构造。但是，当构建为web组件时，主Vue对象的构造是由vue-web组件包装器生成的，我没有看到任何明显的影响它的方法。
如何在我的web组件中使用vue-18n插件？
浏览 2提问于2018-11-16得票数 1
回答已采纳
我有两个vue组件：GetAnimal.vue和DisplayAnimal.vue。GetAnimal.vue使用路由器push向DisplayAnimal.vue发送带有动物数据的JSON。DisplayAnimal.vue显示这些数据。它的工作方式如下:我转到/getanimal，单击一个触发getAnimal()函数的按钮(通过路由器推送)引导我到/viewanimal：
GetAnimal.vue
<script>
import axios from 'axios';
export default {
data: funct
浏览 2提问于2020-05-29得票数 2
回答已采纳
2回答
我一直在我的vuejs应用程序上收到这个警告，但我不知道在哪里和为什么：
build.js:9371 [Vue warn]: Attribute "id" is ignored on component <div> because the component is a fragment instance
我使用的是vue-router，带有index.html：
<body>
<div id="app"></div>
</body>
浏览 13提问于2016-09-25得票数 1
回答已采纳
1回答
我正在尝试将UI元素转换为组件，以重用它。这是两个按钮，用于切换父应用程序中两个DOM元素的可见性。该值保存在本地存储中。
我回顾了几个示例和docu，并创建了一个工作示例。
我想要了解的是，从父应用程序中删除this.layout和toggleLayout()，只需插入<toggle-view v-on:layout="toggleLayout" route="checklist"></toggle-view>并定义只有在激活各自的组件按钮时才会显示div#list-content和div#grid-content。这有可能吗？
我之
浏览 0提问于2019-05-02得票数 0
回答已采纳
我正在使用vue编写一个单页web应用程序。它有4个“page.vue”，其中任何一个都有一个左右两边的子.vue组件。 例如，Page1.vue如下所示(为了保持简短，我保留了样式和脚本) Page1Links和Page1Rechts是我试图加载到主体中的子VUE (使用了两个独立的组件，因为其中一个组件需要尽快更改为一个更复杂的组件，并且它的编写使得另一个组件可以保持原样) <template>
<div>
<div class="page-wrapper">
<div class="page-co
浏览 38提问于2019-07-03得票数 0
回答已采纳
我有一个Vue组件01，它持有另一个Vue组件，那就是Vue组件02。在Vue 01中，我使用ajax请求来获取数据，并将其作为vue 02的道具传递给vue 02。但问题是，在一次ajax请求之后，vue 02不会根据新的数据刷新它的道具，除非我刷新web浏览器，有没有办法只刷新vue 01的组件，就像每个ajax请求一样？
编辑:这是vue 01中的子vue
<show-data-table
v-if="show_data_table"
:data=this.selected_table_data
浏览 0提问于2020-11-02得票数 0
下面的代码在web浏览器中工作，我可以用v-for检索json数据：
export default {
data() {
return {
orders: []
}
},
created() {
axios.get('https://development.octavs.com/testapi.json')
.then(response => {
this.orders = response.data
})
.catch(error => {
console
浏览 0提问于2018-04-10得票数 0
1回答
必须两次要求Vue组件
、、、
我有一个简短的问题:基于下面的代码，为什么我必须“导入”下面的组件两次才能让我的代码正常工作
我是在一个相当封闭的环境中工作，所以目前不能使用Webpack或.vue SFCs，或npm (出于各种意图和目的)。
我拼凑了一个使用类型记录文件的小vue应用程序的工作版本，但我不明白它为什么会起作用:S。
--我必须导入组件文件， 然后需要它作为一个组件。如果可以的话，我想清理它，因为我们将把它作为P.O.C.推出，而开发人员也只是在学习Vue，所以我想在一开始就尽量避免不良实践。
index.ts
import * as Vue from "vue";
import * as
浏览 1提问于2019-02-26得票数 0
1回答
我使用vue-cli.3创建了一个web组件，以便在其他项目中使用以下命令：
vue-cli-service build --target lib --name helloworld ./src/components/HelloWorld.vue
该组件依赖于送交。我不想将lodash与组件捆绑在一起，因为lodash将由主机应用程序提供，因此我在vue.config.js中配置webpack，如下所示：
module.exports = {
configureWebpack: {
externals: {
lodash: 'lodash
浏览 0提问于2018-12-07得票数 5
3回答
我是Vue.js的新手。我对Vue组件之间的通信做了一些简单的练习。但我仍然有一个问题，谁是孩子，谁是家长。例如，我有以下代码：
HTML:
<body>
<div id="root" class="component">
<coupon @applied="onCouponApplied"></coupon>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js
浏览 7提问于2019-08-14得票数 1
回答已采纳
我的目标是创建一个web组件并在vue应用程序中使用它。创作不是问题，也不是用法。我没有成功地将对象作为支柱传递给我的web组件。但是，传递布尔值或字符串似乎很好。
我的vue组件道具：
props:{
user: {
type: Object,
required: true,
default: function() {
return {
name: "Default",
age: 0,
mail: "default@mail.com"
浏览 2提问于2021-01-05得票数 2
回答已采纳
我正在从用Vue UI工具生成的模板构建一个基于单一文件的Vue应用程序。
我理解.vue文件如何定义组件的样式/结构/行为，如何将较小的组件组合成更大的组件，以及顶层的"App“组件如何将所有内容挂载到HTML。
但是，当用户通过应用程序--从登录屏幕到主屏幕再到详细屏幕--被接受的关闭当前屏幕级组件的方法是什么？
泰伊提前了。
- Vuebie
浏览 0提问于2018-12-03得票数 2
我有一个简单的应用程序。单击“到新项链接”将打开一个子组件，该组件具有用于用户输入的模态窗口组件。
从App组件打开模式的最佳方法是什么。我也不确定这个设计是最好的方法。当我使用本机js时，我经常使用类和方法来管理这个问题。但是在VUE中，通过接口访问子组件方法是很痛苦的。我想做的就是在应用程序中的任何地方打开一个新的项目模型。
结构：
|--App.vue
| |--NewItem.vue
| | |--Modal.vue
App.vue：
<template>
<a @click="openNewItem()"> + NEW ITEM&l
浏览 3提问于2022-02-12得票数 1
我正在尝试在路由器上安装Vue.js，但遇到了一些视图问题。我有一个包含子路由的router.js。我想对简单的面包屑使用这种方法，并生成一个清晰的概述，这样我就知道哪条路属于哪里。
开通每一条路线就像一个魔咒，一切都会展现出来。当我打开/apps时，我会从我的Apps.vue中看到一个很好的视图，其中显示了App overview</h1>。但是现在我打开了/apps/app-one，然后我看到了Apps.vue和AppOne.vue模板。如何防止同时显示两个模板？
vue组件如下所示：
Router.js
import Router from 'vue-router&#
浏览 0提问于2018-09-08得票数 4
在Vue中，我有一个主组件，它包含一个子组件，该子组件通过一个按钮加载到页面上，该按钮触发saveTaskComment()。这可以很好地工作，我可以进入子组件函数的.finally部分。HOwever，当它完成并到达这一点时，我想回调父组件以再次调用方法getInformation。我现在使用的方法不起作用，所以我猜$parent在这种情况下是不正确的。 要让childComponent中的方法调用原始函数，我需要做些什么 mainComponent methods: {
getInformation() {
this.$root.$emit('fetc
浏览 24提问于2019-09-04得票数 1
回答已采纳
1回答
我有一个VUE2/Laravel7项目在我的服务器上使用http://examplesite.test在本地工作。它正在使用Vue路由器，一切正常。但是，当我使用示例URL结构将其加载到实时服务器上时，http://example.com/folder1/folder2/ Vue路由器无法将任何内容加载到<div id="app">中，我得到的结果如下：
<div id="app">
<!---->
</div>
我知道它是Vue Router，因为如果我将一个普通的Vue组件放在路由器组件的位置，它会加载得
浏览 2提问于2020-08-14得票数 0
您能教我在VueJS挂载时如何从父组件访问子函数吗？ 我附上了示例代码，以使这个问题变得清晰。 附言:我已经添加子组件和一些代码到父组件。你可以看到下面的代码。 <template>
<div>Child</div>
</template>
<script lang="ts">
import { defineComponent } from "@vue/composition-api";
export default defineComponent({
name: "Child
浏览 31提问于2020-09-02得票数 1
我正在尝试在vue应用程序中使用vue组件库，它由脚本标记加载。该组件库使用了一个webpack设置，并使用设置externals来排除所有vue依赖项。因此，使用该库的主包必须提供vue和其他所需的依赖项。组件库本身使用vue cli和脚本vue-cli-service build --target lib来构建lib.umd.js文件。在我的主机捆绑包的index.html中，我只是通过一个脚本标记来包含该文件。主机包的webpack设置使用config.externals(['@test/my-component-library'])来排除外部加载的组件库。在主机包中，
浏览 15提问于2020-09-18得票数 2
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
