vant ui 组件的引入
2021-07-21 本文已影响0人
BA_凌晨四点
全局引入:
// main.js
import Vant from 'vant';
import 'vant/lib/index.css';
局部引入:
如果用的组件不多,全局引入就太臃肿了,可以只引入用的那几个组件即可。
// Comp.vue
import Vue from 'vue';
import 'vant/lib/share-sheet/style'
import { ShareSheet } from 'vant';
记得记得别忘记引入样式!!
样式的引入方式:
import 'vant/lib/组件的短横线名字/style'
比如上面的:
引入组件是 { ShareSheet },对应的方式名字是:share-sheet,
image.png
可以在node_modules看到,有个index.css,开始我以为引入它。。,其实并不是,而是引入style文件。。
使用:
<van-share-sheet
v-model="isShowShareMenu"
:options="shareOptions"
@select="handleShare"
class="share-pop"
:data-clipboard-text="shareUrl"
>
</van-share-sheet>