neverland 14de879a3b [Doc] add some english documents (#220)
* [bugfix] Checkbox border render error in weixin browser

* [bugfix] TreeSelect dependency path error

* [bugfix] Swipe should clear autoplay timer when destroyed
2017-10-18 07:14:25 -05:00

1.3 KiB

Badge

Install

import { Badge } from 'vant';

Vue.component(Badge.name, Badge);

Usage

Basic Usage

Use active-key prop to set index of chosen 'badge'

:::demo Basic Usage

<van-badge-group :active-key="activeKey">
  <van-badge title="Title" @click="onClick"></van-badge>
  <van-badge title="Title" @click="onClick" info="8"></van-badge>
  <van-badge title="Title" @click="onClick" info="99"></van-badge>
  <van-badge title="Title" @click="onClick" info="199"></van-badge>
</van-badge-group>
export default {
  data() {
    return {
      activeKey: 0
    };
  },
  methods: {
    onClick(key) {
      this.activeKey = key;
    }
  }
};

:::

BadgeGroup API

Attribute Description Type Default Accepted Values
active-key Index of chosen badge `String Number` 0

Badge API

Attribute Description Type Default Accepted Values
title Content String '' -
info Info Message String '' -
url Link String - -