欢迎来到代码驿站!

vue

当前位置:首页 > 网页前端 > vue

mpvue+vant app搭建微信小程序的方法步骤

时间:2022-04-02 14:27:13|栏目:vue|点击:

mpvue使用

# 全局安装 vue-cli
$ npm install --global vue-cli

# 创建一个基于 mpvue-quickstart 模板的新项目
$ vue init mpvue/mpvue-quickstart my-project

# 安装依赖
$ cd my-project
$ npm install
# 启动构建
$ npm run dev

vant使用

yarn add vant

# 将node_modules下的vant-weapp下的dist目录复制到static下的vant目录即可调用

vant调用

main.json中调用

{
 "navigationBarTitleText": "Home",
 "usingComponents": {
  "van-button": "../../static/vant/button/index",
  "van-search": "../../static/vant/search/index",
  "van-tabbar": "../../static/vant/tabbar/index",
  "van-tabbar-item": "../../static/vant/tabbar-item/index",
 }
}

index.vue中使用

<van-search
 placeholder="请输入搜索关键词"
 use-action-slot
 bind:search="onSearch"
 >
 <view slot="action" bind:tap="onSearch">搜索</view>
</van-search>

上一篇:从0到1搭建element后台框架优化篇(打包优化)

栏    目:vue

下一篇:针对Vue路由history模式下Nginx后台配置操作

本文标题:mpvue+vant app搭建微信小程序的方法步骤

本文地址:http://www.codeinn.net/misctech/197947.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有