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>
上一篇下一篇

猜你喜欢

热点阅读