<template>
<div>
<!-- 单个标签 -->
<van-tag type="primary">标签一</van-tag>
<!-- 带关闭按钮的标签 -->
<van-tag type="success" @close="handleClose">标签二</van-tag>
<!-- 可点击的标签 -->
<van-tag type="danger" @click="handleClick">标签三</van-tag>
</div>
</template>
<script>
export default {
methods: {
// 关闭标签时的回调
handleClose() {
console.log('标签被关闭了');
},
// 点击标签时的回调
handleClick() {
console.log('标签被点击了');
},
},
};
</script>
在这个示例中，<van-tag> 组件用于创建标签，通过 type 属性设置标签的样式类型，可以是 'primary'、'success'、'danger' 等。如果需要关闭按钮的标签，可以使用 @close 事件监听关闭操作，并在方法中执行相应的逻辑。如果需要处理标签的点击事件，可以使用 @click 事件监听点击操作。
确保已正确安装和引入 Vant，以及按照文档进行配置。
转载请注明出处：http://www.zyzy.cn/article/detail/5692/Vant