Vue компонент не отображается - PullRequest
0 голосов
/ 22 февраля 2019

Я хочу создать панель управления для своего проекта, и я пытаюсь сделать это с помощью Vuetify и маршрутизатора.Коды:

import cashmain from './views/CashierMain.vue'

Vue.use(Router)

export default new Router({
  mode: 'history',
  base: process.env.BASE_URL,
  routes: [
    {
      path:'cashier/main',
      name:'cashmain',
      component:cashmain
    }
  ]
})

И cashierview.vue в представлениях выглядит так:

<template>
  <corousel></corousel>
</template>

<script>
  import corousel from './../components/AppCorousel'
  export default{ 
      name: 'App',  
      components:{
        corousel
      }
  }
</script>

И corousel выглядит так:

<template>
  <v-carousel height="835">
    <v-carousel-item
      v-for="(item,i) in items"
      :key="i"
      :src="item.src"
      reverse-transition="fade"
      transition="fade"
    ></v-carousel-item>
  </v-carousel>
</template>

<script>
export default {
    data () {
      return {
        items: [
          {
            src: './img/1.jpg'
          },
          {
            src: './img/2.jpg'
          },
          {
            src: './img/3.jpg'
          },
          {
            src: './img/4.jpg'
          }
        ]
      }
    }
  }
</script>

<style lang="stylus">
  #example-custom-transition
    .fade
      &-enter-active, &-leave-active, &-leave-to
        transition: .3s ease-out
        position: absolute
        top: 0
        left: 0

      &-enter, &-leave, &-leave-to
        opacity: 0
</style>

Я не получаю ошибку в консоли, но получаю эту ошибку без сценариев в исходном коде.

К сожалению, модель не работает должным образом без включенного JavaScript.Пожалуйста, включите его, чтобы продолжить.

Пожалуйста, помогите мне с решением.

...