el-badge 標記

Badge 標記

出如今按鈕、圖標旁的數字或狀態標記, 展現新消息或評論的數量

http://element-cn.eleme.io/#/zh-CN/component/badge

<el-badge :value="newsNum"></el-badge>

定義value屬性，它接受Number或者String

• 當value爲number時，能夠爲任意值， 另外由max屬性定義一個number值能夠設置最大值， 超過最大值會顯示 '{max}+'

<el-badge :value="200" :max="99" class="item">
  <el-button size="small">評論</el-button>
</el-badge>
<el-badge :value="100" :max="10" class="item">
  <el-button size="small">回覆</el-button>
</el-badge>

<style>
.item {
  margin-top: 10px;
  margin-right: 40px;
}
</style>

• 定義value爲String類型是時能夠用於顯示自定義文本

<el-badge value="new" class="item">
  <el-button size="small">評論</el-button>
</el-badge>
<el-badge value="hot" class="item">
  <el-button size="small">回覆</el-button>
</el-badge>

<style>
.item {
  margin-top: 10px;
  margin-right: 40px;
}
</style>

• 設置is-dot屬性，它接受一個Boolean

<el-badge is-dot class="item">數據查詢</el-badge>
<el-badge is-dot class="item">
  <el-button class="share-button" icon="el-icon-share" type="primary"></el-button>
</el-badge>

<style>
.item {
  margin-top: 10px;
  margin-right: 40px;
}
</style>

type屬性能夠爲：primary / success / warning / danger / info