微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

uniapp中vant文件的引入及使用

1.下载vant文件

2.在pages同级目录下创建wxcomponents文件夹,并把vant文件夹放入

        在vant官网找到想要的 查看引入方法,如:

        在app.jsonindex.json中引入组件,详细介绍见快速上手

                "usingComponents": {

                  "van-toast": "@vant/weapp/toast/index"

                }

3.在pages.json文件内找到要引入的页面 ,放进去,如:

        {

            "path" : "pages/login/login",                                                                                   

        "style": {

        "navigationBarTitleText": "登录",

        "enablePullDownRefresh": false,

        "navigationStyle": "custom" ,// 隐藏系统导航栏

        "usingComponents":{

        "van-toast": "../../wxcomponents/vant/dist/toast/index"

        }

        }

        }

4.找到对应页面,引入:(根据实际路径填写)

import Toast from 'path/to/@vant/weapp/dist/toast/toast';

例:

    import Toast from '../../wxcomponents/vant/dist/toast/toast';


注:若提示未找到节点 则文件中写入<van-toast id="van-toast" />

注:还需要在App.vue 中设置:

/*每个页面公共css */

@import "/wxcomponents/vant/dist/common/index.wxss";

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐