我已经在Laravel + vue项目中使用npm安装了AminLte v3,广告效果很好,但是当我单击标签为的Side navbar主菜单时
<li class="nav-item has-treeview">
<a href="#" class="nav-link">
<i class="nav-icon fas fa-users"></i>
<p>
Members
<i class="fas fa-angle-left right"></i>
<span class="badge badge-warning right">new:2</span>
</p>
</a>
<ul class="nav nav-treeview">
<li class="nav-item">
<router-link :to="{name : 'members'}" class="nav-link">
<i class="fas fa-user-check nav-icon"></i>
<p>All</p>
</router-link>
</li>
<li class="nav-item">
<router-link :to="{name:'membersLatest'}" class="nav-link">
<i class="fas fa-user-plus nav-icon"></i>
<span class="badge badge-danger right">2</span>
<p>Latest</p>
</router-link>
</li>
<li class="nav-item">
<router-link :to="{name:'membersPending'}" class="nav-link">
<i class="fas fa-user-clock nav-icon"></i>
<p>Pending</p>
</router-link>
</li>
<li class="nav-item">
<router-link :to="{name:'membersSuspended'}" class="nav-link">
<i class="fas fa-user-lock"></i>
<span class="badge badge-danger right">2</span>
<p>Suspended</p>
</router-link>
</li>
</ul>
</li>
它将我重定向到#
的路由器路径,
<a href="#" class="nav-link">
<i class="nav-icon fas fa-users"></i>
<p>
Members
<i class="fas fa-angle-left right"></i>
<span class="badge badge-warning right">new:2</span>
</p>
</a>
这部分内容并没有在主菜单中打开子菜单,我从另一个vue组件中包含了navBar。
任何人都可以提出一个解决方案吗?
答案 0 :(得分:2)
当您点击其他路线而不是允许路线时,树视图选择器无法找到该元素。当您按下url重定向到adminlte时,树视图将不起作用,因为选择器是在元素安装之前定义的。
要解决此问题,请在侧边栏组件中定义一个已安装的挂钩。
mounted(){
$('[data-widget="treeview"]').Treeview('init');
}
答案 1 :(得分:0)
在 bootstrap.js 文件中将 require('admin-lte')
放在下面
require('bootstrap')