Skip to content

vue bootstrap4 sidebar with collapse and scroll side-content 大屏bootstrap边侧可收缩,左右两侧滚动条,移动端适配,左侧导航栏点击滑入

Notifications You must be signed in to change notification settings

nejinn/bootstrap4-flex-sidebar

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

9 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

bootstrap-yaoxin-sidebar

####vue bootstrap sidebar support

  • sidebar collapse
  • sidebar nav accordion support
  • sidebar hover collapse
  • Mobile Device support
  • In Mobile Device, sidebar Sidebar will become canvas
  • left content and right content has own scroll bar

左右布局,支持左侧导航栏固定可收缩,鼠标移动可触发伸展,左侧导航栏手风琴模式,支持移动端适配,小屏左侧导航栏会变成从左侧滑出的抽屉。左右两个容器有自己的滚动条,左侧滚动右侧不动,右侧滚动左侧不动。

you need &需要以下依赖

    "bootstrap": "^4.4.1",
    "bootstrap-vue": "^2.2.2",
    "vue": "^2.6.11",
    "vue-router": "^3.1.3",

if you do not need bootstrap-vue, you can delete bootstrap vue and delete b-nav in sidebarnav and header nav。all b-* component is relative to bootstrap-vue.

如果你不需要bootstrap-vue,你可以删除左边导航栏和头部导航栏中跟bootstrap-vue有关的组件,一样可以运行,不过你就需要自己写导航栏有关nav item。 跟bootstrap-vue有关的组件都是b-* 这样的。

if you need a sidernav accordion click this:accordion

如果你需要一个手风琴边侧导航,直通车accordion

效果

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Lints and fixes files

npm run lint

Customize configuration

See Configuration Reference.

About

vue bootstrap4 sidebar with collapse and scroll side-content 大屏bootstrap边侧可收缩,左右两侧滚动条,移动端适配,左侧导航栏点击滑入

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages