uniapp项目h5端使用vant组件

在做uniapp项目时由于vant组件小程序和h5组件是不通用的，所以vant组件在h5中要单独引用。

1.首先使用npm i vant -S --production 安装vant的组件包，安装成功后结构目录如下

2.我们在全局中引用vant组件，找到main.js文件，在文件中添加一下代码

import Vue from 'vue'
import Vant from 'vant';


Vue.use(Vant);

3.进行了以上操作后我们只需要在所用到的页面中直接使用组件就行了

<van-cell title="离校日期" >
			<view v-show="!time=='' " @click="isDatapickered()">{{time}}</view>
			<view v-show="time=='' " @click="isDatapickered()" class="title" >请选择 <van-icon name="arrow"  class="iconTitle" /></view>
		</van-cell>
		<van-popup close="onClose" position="bottom"  v-model="isDatapicker" >
			
			
			<van-datetime-picker
			
			  type="date"
			  title="离校日期"
			  v-show="isDatapicker"
			  @confirm="datapicker"
			  @cancel="unDatapicker"
			/>
		</van-popup>