<fish-tag index="1">Tag1</fish-tag>
<fish-tag index="2">TAG</fish-tag>
<fish-tag index="3" @close="{}">close</fish-tag>
<fish-tag index="3" color="primary">close</fish-tag>
<template>
<fish-tags :items="tags" edited @close="groupCloseHandler" @add="addCheckHandler"></fish-tags>
</template>
<script>
export default {
data () { return {tags: ['tag1', 'tag2', 'tag3']} },
methods: {
addCheckHandler (v) {
this.tags.push(v)
},
groupCloseHandler (index) {
this.tags.splice(index, 1)
}
}
}
</script>
<template>
<fish-tags :items="tags1" @click="checkClickHandler"></fish-tags>
</template>
<script>
export default {
data () { return {tags1: [[true, 'tag1-radio'], [false, 'tag2-radio'], [false, 'tag3-radio']]} },
methods: {
checkClickHandler (event, index, checked) {
this.tags1.splice(index, 1, [checked, this.tags1[index][1]])
}
}
}
</script>
<fish-tag index="top" attached="top">Top</fish-tag>
<fish-tag index="bottom" attached="bottom">Bottom</fish-tag>
<fish-tag index="top left" attached="top left">Top Left</fish-tag>
<fish-tag index="top right" attached="top right">Top Right</fish-tag>
<fish-tag index="bottom left" attached="bottom left">Bottom Left</fish-tag>
<fish-tag index="bottom right" attached="bottom right">Bottom Right</fish-tag>
<fish-tag :index="color" :color="color" :key="color"
v-for="color in ['red', 'orange', 'yellow', 'olive', 'green', 'teal', 'blue', 'violet', 'purple', 'pink', 'brown', 'grey', 'black']" v-html="color"></fish-tag>
<fish-button style="position: relative;">
myliang
<fish-tag index="floating" floating color="negative">20</fish-tag>
</fish-button>
<fish-button style="position: relative;">
yuliang
<fish-tag index="floating" floating color="negative" shape="circle">10</fish-tag>
</fish-button>
<fish-tag index="circle" shape="circle">2</fish-tag>
<fish-tag index="circle" shape="circle" color="primary">4</fish-tag>
| {{column}} |
|---|
| {{column}} |
|---|
| {{column}} |
|---|