首页 > 解决方案 > Vuejs webpack 中 App.vue 与其他组件的关系

问题描述

我用 webpack 安装了 vuejs。

vue init webpack frontend

我在 main.js 使用 vue-router

routes: [
  {
      path: '/',
      name: 'Home',
      component: HomeView
  },

App.vue 就像这里。

<template>
  <div>
    <div id='toparea'></div>
    <router-view></router-view>
    <div id='btmarea'></div>
  </div>
</template>

这里的文件结构

这里的文件结构

App.vue 和 HomeView.vue 的关系是专利-子关系吗?如何在 HomeVuer.vue 使用 App.vue 的数据?

更详细:

我像这样在 App.vue 打印了一个变量。

<div id='toparea'>
    <span v-html="variable_foo"></span>
</div>

我想在 HomeView.vue 的已安装步骤中更改 HomeView.vue。

标签: vue.js

解决方案


我发现 App.vue 显然是来自 vuejs devtool 的 HomeView.vue 的父级。

这意味着路由器视图组件是主应用程序视图组件的子组件。

在此处输入图像描述


推荐阅读