Question

我在App.vue内部使用一个路由视图，在路由中我使用的是Base组件，我想要的是在“ Base”组件中称为“ teste”组件。

我已经了解了vue-router中的嵌套命名视图，但是没有解决我的问题。

Route.js

import Base from './components/base/Base.vue';

export const routes = [
    {
        path: '/',
        components: {
          default: Base
        }
      },

App.vue

<div id="app">
    <router-view></router-view>
  </div>

Base.vue

<template>
  <teste></teste> //this component dosent render
</template>

<script>
import teste from './SideBar.vue'

export default {
  name: 'Base',
  components: {
      teste
  }
}

SideBar.vue

<template>
    <p>teste</p>
</template>

<script>
export default {
  name: 'teste'
}

Main.js

import Vue from 'vue'
import App from './App.vue'
import VueRouter from 'vue-router';
import Vuex from 'vuex';
import {routes} from './routes'


Vue.use(VueRouter)
Vue.config.productionTip = false

const router = new VueRouter({
  routes
});
new Vue({
  render: h => h(App),
  router
}).$mount('#app')

在路由器组件中使用Vue组件

0 个答案: