‹Router-view› не работает при обновлении до vue.js 2.0

Я полностью застрял в получении компонента для рендеринга через router-view с использованием vue.js 2.0 и vue-router.

У меня установлен vue devtools, и я вижу метку «фрагмент» рядом с router-view, но никаких других деталей.

Может быть важно отметить, что я использую laravel-elixir-vueify и browserify.

App.js

var Vue = require('Vue');
var VueRouter = require('vue-router');

import dashboard from './components/dashboard.vue'

Vue.component('dashboard', dashboard);

Vue.use(VueRouter);


const router = new VueRouter({
  routes: [
    { path: '/', component: dashboard }
  ]

const app = new Vue({
  router
}).$mount('#vueapp')

dashboard.blade.php

<div id="vueapp">
  //other code removed for space
  <router-view></router-view>
</div>

dashboard.vue

<template>
    <div class="col-md-12 col-lg-12">
        <div class="block">
          <div id="showCalendar"></div>
        </div>
    </div>
</template>
//Note: I tried adding an extra <div></div> within the template, but that didn't make a difference. 

<script>

export default{

mounted: function() {

    this.CompCalendar();
},
methods: {

    CompCalendar: function() {

                /* Initialize FullCalendar */
                var date = new Date();
                var d = date.getDate();
                var m = date.getMonth();
                var y = date.getFullYear();

        this.$nextTick(function() {
            var events = this.$http.get('/events/local/index')
                .then(function(response){

                    $('#showCalendar').fullCalendar({
                    header: {
                        //unimportant options
                    },
                    //unimportant options
                    eventClick: function(calEvent, jsEvent, view){

                        var eventId = calEvent.id;
                        router.push({
                            path: 'details/'+eventId

                        });
                    },
                    });
                })
        });
    }
   }
};
</script>

person retrograde    schedule 15.10.2016    source источник
comment
Я почти уверен, что это связано с конфликтом laravel-elixir-vueify, который ссылается на vue 1.0.   -  person retrograde    schedule 15.10.2016
comment
ты проглотил глоток после обновления? как выглядят ваши packages.json и gulpfile.js?   -  person jeremykenedy    schedule 15.10.2016


Ответы (2)


Итак, во-первых, вам не нужно регистрировать Vue.component('dashboard', dashboard) Достаточно ссылки на в маршрутах. Все остальное мне нравится. Есть ли у вас ошибки в консоли?

Попробуйте routes = [ { path: '', component ..

person Psi    schedule 15.10.2016

Похоже, вы не зарегистрировали ни одного компонента для этого действия.

router.push({
   path: 'details/'+eventId
});

Похоже, вам в роутере нужно что-то подобное:

 { path: '/details', component: Details }
person Max Liashuk    schedule 17.10.2016