Question

学习vue，使用Laravel进行设置，因为项目很小，我避免使用npm并通过cdn导入文件，但是会出错

[Vue警告]：未知的自定义元素：-您是否已注册   组件正确吗？对于递归组件，请确保   提供“名称”选项。

（位于）

app.js：36567 [Vue警告]：未知的自定义元素：-做过   您是否正确注册了组件？对于递归组件，   请确保提供“名称”选项。

1）index.blade.php

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>AdminLTE 2 | Dashboard</title>
  <!-- Tell the browser to be responsive to screen width -->
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  <meta name="csrf-token" content="{{ csrf_token() }}">
  @include('master.partials.css')

</head>
<body class="hold-transition skin-blue sidebar-mini">
<div class="wrapper" id="app">

  @include('master.partials.header')

  <!-- Left side column. contains the logo and sidebar -->
  @include('master.partials.leftSideBar')

  <!-- Content Wrapper. Contains page content -->
  <div class="content-wrapper">
      <router-view></router-view>
    @yield('content')
  </div>
  <!-- /.content-wrapper -->

  @include('master.partials.footer')
</div>
<!-- ./wrapper -->
  @include('master.partials.js')
  <script src="https://unpkg.com/vue-router/dist/vue-router.js"></script> 
</body>
</html>

2）master.partials.leftSideBar包含路由器链接

 <li class="active treeview">
        <router-link to="/dashboard">Dashboard</router-link>
      <a href="#">
        <i class="fa fa-dashboard"></i> <span>Dashboard</span>

      </a>
    </li>

3）resource / js / app.js

require('./bootstrap');

window.Vue = require('vue');
Vue.use(VueRouter);

Vue.component('example-component', require('./components/ExampleComponent.vue'));


const routes = [
    { path: '/dashboard', component: require('./components/dashboard/index.vue') }
  ]

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

Vue路由器无法正常工作（未知的自定义元素：<router-link>）

0 个答案: