# 基本用法

<template>
  <div>
    <ui-tag @close="tagClose" :checked.sync="item.checked" :color="item.color" :closable="item.closable" v-for="(item,index) in tags" :key="index" :name="item.name">
      {{item.label}}
    </ui-tag>
  </div>
</template>

<script>
export default {
  data(){
    return {
tags:[
        {
          checked:true,
          closable:true,
          color:'default',
          name:'1',
          label:'标签一'
        },
        {
          checked:true,
          closable:true,
          color:'primary',
          name:'2',
          label:'标签二'
        },
        {
          checked:true,
          closable:true,
          color:'success',
          name:'3',
          label:'标签三'
        },
        {
          checked:true,
          closable:true,
          color:'blue',
          name:'4',
          label:'标签四'
        },
        {
          checked:true,
          closable:true,
          color:'error',
           name:'5',
          label:'标签五'
        }
      ]
    }
  },
  methods:{
    tagClose(name){
        console.log('name',name)
      }
  }
}
</script>

<style>

</style>