1. 前言
- 最近使用vant遇到个小问题记录如下
vue3使用的vant 3x
2. 问题
- 使用函数式组件 界面没有反应/效果
3. 解决方案
- 看文档,发现自己忘记引入样式了,真想抽死自己
- 快速上手第四部分
Vant中有个别组件是以函数的形式提供的，包括Toast，Dialog，Notify和ImagePreview组件。在使用函数组件时，unplugin-vue-components无法自动引入对应的样式，因此需要手动引入样式。
// Toast import { Toast } from 'vant'; import 'vant/es/toast/style'; // Dialog import { Dialog } from 'vant'; import 'vant/es/dialog/style'; // Notify import { Notify } from 'vant'; import 'vant/es/notify/style'; // ImagePreview import { ImagePreview } from 'vant'; import 'vant/es/image-preview/style';
4. 简单使用
Dialog.alert({ title: '标题', message: '代码是写出来给人看的，附带能在机器上运行。', }).then(() => { // on close }); Dialog.alert({ message: '生命远不止连轴转和忙到极限，人类的体验远比这辽阔、丰富得多。', }).then(() => { // on close });
5. 后记
- 仅做自己的沙雕时刻纪念吧,希望以后不要忘记,长点心
