未捕获的ReferenceError:Spark Laravel

时间:2017-02-28 07:59:29

标签: vuejs2 laravel-spark

我试图将一些功能,即NavBar上的Laravel Spark下拉到我的app.blade.php。

我的代码看起来像这样

<body class="skin-1">

  <!-- Wrapper-->
    <div  id="spark-app" v-cloak>

        <!-- Navigation -->
        @include('layouts.wf_navigation')

        <!-- Page wraper -->
        <div id="page-wrapper" class="gray-bg">

            <!-- Main view  -->
            @yield('content')



            <!-- Footer -->
            @include('layouts.footer')

        </div>
        <!-- End page wrapper-->

    </div>
    <!-- End wrapper-->
@show
<script src="/js/app.js"></script>

但是我收到了错误

  

未捕获的ReferenceError:未定义总线

错误引用了APp.js中的这行代码

  Bus.$on('updateUser', function () {
            self.getUser();
        })

更新

Bus变量在App.js中定义,代码如下所示

if (window.Vue === undefined) {
  window.Vue = __webpack_require__(287);

  window.Bus = new Vue();
}

注意:上一个问题已修复,删除了我app.blade.php顶部的额外Vuejs文件

更新1 有新的错误

  

[Vue警告]:模板应该只负责映射状态   到UI。避免在模板中放置带副作用的标签,   比如。

包含的模板是

wf_navigation.blade.php

<div class="row border-bottom">
    <nav class="navbar navbar-static-top white-bg" role="navigation" style="margin-bottom: 0">
        <div class="navbar-header">
            <a class="navbar-minimalize minimalize-styl-2 btn btn-primary " href="#"><i class="fa fa-bars"></i> </a>
            <form role="search" class="navbar-form-custom" method="post" action="/">
                <div class="form-group">
                    <input type="text" placeholder="Search for something..." class="form-control" name="top-search" id="top-search" />
                </div>
            </form>
        </div>


        <ul class="nav navbar-top-links navbar-right">


        <?php $currentTeam = auth()->user()->currentTeam; ?>

        @if($currentTeam)
        <li>
            <a href="" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
                {{ $currentTeam->name }}
                <span class="caret"></span>
            </a>

            <ul class="dropdown-menu" role="menu">
                <li>
                    <a href="/settings/teams/{{$currentTeam->id}}#/owner">Profile</a>
                </li>
                <li>
                    <a href="/settings/teams/{{$currentTeam->id}}#/membership">Members</a>
                </li>
                <li>
                    <a href="/settings/teams/{{$currentTeam->id}}#/subscription">Subscription</a>
                </li>
                <li>
                    <a href="/settings/teams/{{$currentTeam->id}}#/invoices">Invoices</a>
                </li>

                @include('spark::nav.teams')

            </ul>
        </li>
        @endif

        </ul>

    </nav>
</div>

正在调用@include(&#39; spark :: nav.teams&#39;)

teams.blade.php看起来像这样

<li class="dropdown-header">{{ ucfirst(str_plural(Spark::teamString())) }}</li>

<!-- Create Team -->
@if (Spark::createsAdditionalTeams())
    <li>
        <a href="/settings#/{{str_plural(Spark::teamString())}}">
            <i class="fa fa-fw fa-btn fa-plus"></i>Create {{ ucfirst(Spark::teamString()) }}
        </a>
    </li>
@endif

<!-- Switch Current Team -->
@if (Spark::showsTeamSwitcher())
    <li v-for="team in teams">
        <a :href="'/{{ str_plural(Spark::teamString()) }}/'+ team.id +'/switch'">
            <span v-if="user.current_team_id == team.id">
                <i class="fa fa-fw fa-btn fa-check text-success"></i>@{{ team.name }}
            </span>

            <span v-else>
                <img :src="team.photo_url" class="spark-team-photo-xs"><i class="fa fa-btn"></i>@{{ team.name }}
            </span>
        </a>
    </li>
@endif

<li class="divider"></li>

&#39; footer.blade.php&#39;

<div class="footer"> <div class="pull-right"> V4.0 </div> <div> <strong>Powered By</strong> Energy Engine &copy; 2010-2017 </div> </div>

我是vue的新手,所以不知道那里发生了什么

0 个答案:

没有答案