一、下载

npm i @vant/weapp -S --production

下载完毕之后，就可以在 node_modules 文件夹里，看见下载的包了。

2、移动文件夹

把刚刚下载的包文件夹下的 lib 文件夹拷贝进 src\components文件夹中。

3、使用

结合官方文档，按需引入使用需要的组件。这里比如使用 button 和 dialog。

3.1、button

（1）在 config 对象下的 usingComponents 对象中引入组件。

（2）直接从官方文档中复制到页面中。

（3）效果如下

3.2、dialog

（1）代码如下

（2）效果如下

微信小程序 —— wepy 使用 Vant Weapp的更多相关文章

  1. 微信小程序搭建mpvue+vant+flyio

    导语 上一篇文章微信小程序搭建mpvue+vant已经介绍了如何搭起mpvue项目及引入vant,本篇文章继续在它的基础上,引入flyio,并做一些封装,目的是为了在小程序发起请求. 这时读者会有些疑 ...

  2. 微信小程序wepy开发循环wx:for需要注意

    微信小程序wepy开发循环wx:for需要注意 item index值必须在wx:for之后使用 <view wx:for="{{tablist}}" class=" ...

  3. 微信小程序搭建mpvue+vant

    第一步:查看是否已经装了node.js $ node -v $ npm -v   正确姿势 没有装的话前往Node.js官网安装 第二步:安装cnpm $ npm install -g cnpm -- ...

  4. 微信小程序没找到构建npm或者没找到node_modules目录以及如何在小程序中引入vant weapp组件

    微信小程序没找到构建npm或者没找到node_modules目录解决方法如下: 按照微信小程序提供的文档npm install是不行的,直接提示没找到可构建的npm包. 1.直接安装:npm init ...

  5. 微信小程序 + wepy快速开发

    wepy官网:https://tencent.github.io/wepy/document.html,想要了解全面最好去官网,以下只是指出项目里常用地方. 1.页面跳转 (1)//有返回跳转wepy ...

  6. 微信小程序wepy框架开发资源汇总

    开源项目 wepy-wechat-demo:基于wepy开发的仿微信聊天界面小程序 深大的树洞:基于wepy开发的树洞类微信小程序 wepy-demo-bookmall:微信小程序

  7. 解决微信小程序wepy真机预览跟本地表现不一样，数据变化了视图没变化

    当时搜了很多相关问题都没找到相似的 只看到有这个相似的描述wepy在onLoad里修改data-object的值页面不渲染 ,通过setData解决的. 但是这个还不是根本的解决办法,有些地方用set ...

  8. 理解微信小程序Wepy框架的三个事件交互$broadcast，$emit，$invoke

    $broadcast: $broadcast事件是由父组件发起,所有子组件都会收到此广播事件,除非事件被手动取消.事件广播的顺序为广度优先搜索顺序,如上图,如果页面Page_Index发起一个$bro ...

  9. 微信小程序Wepy框架的三个事件交互($broadcast，$emit，$invoke)

    $broadcast: $broadcast事件是由父组件发起,所有子组件都会收到此广播事件,除非事件被手动取消.事件广播的顺序为广度优先搜索顺序,如上图,如果页面Page_Index发起一个$bro ...

随机推荐

  1. Creating a bootable Ubuntu USB stick

    Windows: https://tutorials.ubuntu.com/tutorial/tutorial-create-a-usb-stick-on-windows#0 Ubuntu: http ...

  2. 工控安全入门（四）—— DNP3协议

    我们之前看过了法国施耐德的Modbus.德国西门子的S7comm,这次就让我们把目光投到美洲,看看加拿大的HARRIS的DNP3有什么特别之处. 这次选用的流量包部分来自w3h的gitbub: htt ...

  3. MUI使用vue示例

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...

  4. ECMAScript 5 严格模式

    1. 变量必须使用var声明,杜绝不小心将本地变量声明成一个全局变量 在常规模式下,如果我们声明一个变量时省略了var关键字,解析引擎会自动将其声明为全局变量,但在严格模式下,会直接抛出异常,不会为我 ...

  5. hibernate 注释多表 级联操作

    一对多模型(单向) 说明: 一个客户对应多个地址,通过客户可以获得该客户的多个地址的信息.客户和地址是一对多的关系,并且客户与地址是单向关联的关系. 映射策略 # 外键关联:两个表的关系定义在一个表中 ...

  6. Twitter Storm中Topology的状态

    Twitter Storm中Topology的状态 状态转换如下,Topology 的持久化状态包括: active, inactive, killed, rebalancing 四个状态. 代码上看 ...

  7. nfs服务安装配置

    一.准备阶段 配置解析主机 检查版本及内核 二.服务端安装 1) 配置yum把下载好的软件留着,下次备用,不用再下载 cachedir=/var/cache/yum/$basearch/$releas ...

  8. laravel--request类获取传值

    request类获取传值 Request类的方法很多,常用的有如下几个: Request -> all() : 表示一次性获取所有的传值(包括get和post,但不能获取参数) Request ...

  9. git图形化

    在windows下安装git中文版客户端并连接gitlab 转载自:https://blog.whsir.com/post-1801.html 下载git Windows客户端 git客户端下载地址: ...

  10. Thrift---more efficient transport protocol.

    Thrift  是什么?  Thrift源于大名鼎鼎的facebook之手,在2007年facebook提交Apache基金会将Thrift作为一个开源项目,对于当时的facebook来说创造thri ...