ym-drawer

ym-drawer can be used to do these fancy things:

• build mobile navbar
• build mobile ui components with PC ui libraries like element-ui
• become a container to show various data

Largely refered to muse-ui。

Getting Started

install

To begin with, just install ym-drawer:

npm i ym-drawer -s

examples

You can use YmDrawerHorizontal as a vue component anywhere like this:

<template>
  <div class="home">
    <ym-drawer-horizontal
      :open.sync="isDrawerOpen"
      :zDepth="6666">
      This is ym-drawer-horizontal!!!
    </ym-drawer-horizontal>
  </div>
</template>

<script>
export default {
  name: 'home',
  data() {
    return {
      isDrawerOpen: false,
    };
  },
  methods: {
    handleClick() {
      this.isDrawerOpen = !this.isDrawerOpen;
    },
  },
}
</script>

<style lang="scss">
.ym-drawer--horizontal {
  background-color: #333;
}
</style>

Attributes

| param | explain | type | required | Default value | | ----------------- | -------------------------------- | ----------------- | ----------- | ---------------- | | open | whether is open | Boolean | yes | | | right | whether position is right | Boolean | | | | docked | whether is decked | Boolean | | true | | width | width value | [Number, String] | | | | zDepth | z-index value | Number | | 100 | | overlayClick | callback when clicking overlay | Function | | |

ToDo

• [x] complete YmDrawerVertical component.