el-header

short description + sample image(png/gif/mp4)

Table of Contents

• Introduction
• Features
• Install
• Usage
• Links
• Contributing
• Contributors
• License

Introduction

If there is no more words to write, this section can be deleted.

⬆ Back to Top

Features

头部导航组件

⬆ Back to Top

Install

import ElHeader from '@dxp-dc/el-header'
Vue.use(ElHeader)

⬆ Back to Top

Usage

<template>
    <el-header
      :apps="apps"
      :message="message"
      @help="handleHelpClick"
      @data-board="handleDataBoardClick"
      @logout="handleLogout"
    />
</template>

<script>
    const apps = [
      {
        active: true,
        name: '零售',
        icon: 'iconh_shangpinshuju',
        onClick: () => {
          apps[0].active = true
          apps[1].active = false
          // eslint-disable-next-line no-console
          console.log('零售')
        },
      },
      {
        active: false,
        name: '运营',
        icon: 'iconh_yunying1',
        onClick: () => {
          // eslint-disable-next-line no-console
          console.log('运营')
          apps[0].active = false
          apps[1].active = true
        },
      },
    ]

export default {
  data() {
    return {
      apps,
      message: {
        badge: true,
        onClick: () => {
          // eslint-disable-next-line no-console
          console.log('message')
          this.message.badge = false
        },
      },
    }
  },
  methods: {
    handleLogout() {
      console.log('logout')
    },
    handleDataBoardClick() {
      console.log('handleDataBoardClick')
    },
    handleHelpClick() {
      console.log('handleHelpClick')
    },
  }  
}
</script>

⬆ Back to Top

Links

• docs

⬆ Back to Top

Contributing

For those who are interested in contributing to this project, such as:

• report a bug
• request new feature
• fix a bug
• implement a new feature

Please refer to our contributing guide.

⬆ Back to Top

Contributors

Thanks goes to these wonderful people (emoji key):

This project follows the all-contributors specification. Contributions of any kind welcome!

⬆ Back to Top

License

MIT

⬆ Back to Top