在 Vant4 中,你可以使用 <van-tag> 组件来创建标签。以下是使用 Vant4 的 <van-tag> 组件的基本步骤:

1. 安装 Vant4:
   确保你的项目中已经安装了 Vue.js,并使用以下命令安装 Vant4:
   npm install vant@next

2. 引入 Vant4:
   在你的 Vue 组件中,通过 import 语句引入需要的 Vant 组件。对于标签,你需要引入 Tag 组件。
   import { createApp } from 'vue';
   import { Tag } from 'vant';
   import 'vant/lib/index.css';

   const app = createApp(/* your app */);
   app.use(Tag);

3. 使用标签组件:
   在你的 Vue 模板中使用 <van-tag> 标签来创建标签。
   <template>
     <div>
       <van-tag>标签内容</van-tag>
     </div>
   </template>

   你也可以使用不同的类型和样式来自定义标签。例如,可以使用 type 属性设置标签的类型,如 primary、success、danger 等。
   <van-tag type="primary">主要标签</van-tag>
   <van-tag type="success">成功标签</van-tag>
   <van-tag type="danger">危险标签</van-tag>

4. 更多配置选项:
   <van-tag> 组件提供了其他一些配置选项,例如 plain 属性用于设置标签是否镂空,color 属性用于自定义标签的颜色等。
   <van-tag plain>镂空标签</van-tag>
   <van-tag color="#f00">自定义颜色标签</van-tag>

以上是使用 Vant4 的 <van-tag> 组件创建标签的基本步骤。你可以根据实际需求进一步调整样式和配置。


转载请注明出处:http://www.pingtaimeng.com/article/detail/5844/Vant