Question

重定向到新的链接和样式css可以，但是在新组件上没有方法或事件可以初始化。组件导航栏保持正常运行，并且检查器没有显示任何错误。如果重新加载页面，则所有内容均可再次使用。道歉我的英语

main.js

import Vue from 'vue'
import VueRouter from 'vue-router'
import Routes from './routes'
import App from './componentes/App.vue'
Vue.use(VueRouter)
const router = new VueRouter({
    routes: Routes,
    // mode: 'history'`Texto preformateado`
});

const app = new Vue({
  router,
  el: '#app',
  render: h => h(App)
})

app.vue

<template>
  <div id="app">
    <encabezado></encabezado>
    <!-- <keep-alive> -->
        <router-view></router-view>
    <!-- </keep-alive> -->
  </div>
</template>
<script>
import encabezado from './encabezado.vue'
export default {
  name: 'app',
  components: {
    encabezado
  }, 
}
</script>

route.js

import Financiero from './componentes/vistas/financiero.vue';
import Principal from './componentes/principal/principal.vue';
export default [
  {
    path: '/financiero',
    component: Financiero,
    name: 'Financiero'
  },
  { path: '/principal', component: Principal, name: 'principal' },
]

组件

<template>
  <div :class="{dvContainer:movil}">
      <div v-if="movil" class="fixed-action-btn">
        <a class="btn-floating btn-large sidenav-trigger pulse waves-effect waves-light purple darken-3" href="#" data-target="slide-out">
          <i class="large material-icons">chat</i>
        </a>
      </div>
    <ul id="slide-out" class="collapsible" :class="{sidenav: movil, enCelularSide: movil, menuLateral: !movil }" style="padding-bottom: 30px !important;">
      <li class="active">
        <div class="collapsible-header" ><i class="material-icons">filter_drama</i>Analisar proyecto</div>
        <div class="collapsible-body cuerpoItemColapse">
          <mapa></mapa>
        </div>
      </li>
    </ul>
  </div>
</template>
<script>
import evaluacion from '../navegacion/evaluacion.vue'
import mapa from '../navegacion/mapa.vue'
import resumen from '../navegacion/resumen.vue'
export default{

Answer 1

import Financiero from '@/componentes/vistas/financiero.vue';
import Principal from ' @/componentes/principal/principal.vue';

Example here

路由器视图未加载第二个组件

1 个答案: