1.0.8 • Published 2 years ago

zy-sidebar v1.0.8

Weekly downloads
-
License
ISC
Repository
github
Last release
2 years ago

zy-sidebar

npm.io npm.io npm.io

npm address

npm address in here : https://www.npmjs.com/package/zy-sidebar

Explain

1 . sideBar Menu

2 . Support customization,for example: placeHolder 、 event 、 menuList ...

3 . normal search input and menuTree open

4 . .....(There will be more follow ups)


Usage

1.1 Installation

  npm i zy-sidebar

1.2 ES6 Import

import zySidebar from 'zy-sidebar';

export default {
  components: {
    zySidebar
  }
}

Basic Example

html

<template>
  <aside>
    <el-menu
      :default-active="xxx"
      :collapse="xxx"
      :collapseTransition="false"
      :unique-opened="true"
      class="site-sidebar__menu">
      <el-menu-item>
        <zy-sidebar placeHolder="请输入菜单名" :menuList="menuList" @route="gotoRouteHandle" :_renderHandle="renderHandle"></zy-sidebar>
      </el-menu-item>
    </el-menu>
  </aside>
</template>

js

import zySidebar from 'zy-sidebar';

export default {
  components: {
	  zySidebar
  },
  data() {
    return {
      menuList: [],
    }
  }
  },
  methods: {
    renderHandle(obj){
      return (<div><icon-svg name={obj.icon}></icon-svg><span style="padding-left:10px;">{obj.title}</span></div>)
    }
  }
}

Props

propstypedefaultdescription
iconString""el-icon-search Input prompt
placeHolderString""placeHolder Input prompt
menuListArray[]menuList source prompt
_renderHandleFunction() => {}_renderHandle event render

1.0.8

2 years ago

1.0.7

2 years ago

1.0.2

3 years ago

1.0.6

3 years ago

1.0.5

3 years ago

1.0.4

3 years ago

1.0.3

3 years ago

1.0.1

3 years ago

1.0.0

3 years ago