mpvue返回上一个页面_Mpvue+Vant-Weapp开发小程序遇坑之解决系列

嗨，我是Kit，我来分享Mpvue小程序的踩坑问题，以及如何引入Vant-Weapp，下面开始我的表演，如有问题，可以写在下面的评论里面，只接受建议不接受评论，我很骄傲的~哈哈

相比很多时候我们写东西，需要引入一些第三方的UI库之类的，主要是快，但是第一次使用难免遇到问题，今天我就来说说我在写Mpvue+Vant-Weapp小程序的时候遇到的问题以及解决的方案，有更好的可以提出。

这几天写了mpvue的小程序，首先我们来看下怎样安装Mpvue,使用过vue的伙伴，就很简单了，操作如下

# 全局安装 vue-cli$ npm install --global vue-cli# 创建一个基于 mpvue-quickstart 模板的新项目$ vue init mpvue/mpvue-quickstart my-project# 安装依赖，走你$ cd my-project$ npm install$ npm run dev

如下就已经启动成功

关于安装Mpvue我不做多余的解释了，不懂的点击链接直接看官网安装查看官网安装教程

下面我们主要做Vant-Weapp的安装说明，我先来说几点需要注意的，主要就是引入跟引入完成以后Es6以及Es5的出错问题，这也是很多伙伴遇到的问题。

首先我们来下载Vant-Weapp，你可以在github直接下载也可以命令下载,

官网地址https://youzan.github.io/vant-weapp/#/intro

github地址https://github.com/youzan/vant-weapp

git命令下载方式如下

$ git clone https://github.com/youzan/vant-weapp.git

获取下载地址如下

直接下载方式

ok，操作完以上步骤你会得到一个文件夹或者下面直接下载的你会得到一个压缩包，这样我们就得到了框架，需要复制他里面的vant-weappdist到我们的Mapvue项目当中的my-projectstaticvant-weapp，这个改名是为了不跟项目里面的dist文件夹重名，名称你可以自定义......如下所示

很好，我们已经完成了初期的vant导入工作，接下来就是怎样在项目当中使用引入他的组件部分，需要你的src文件夹下面新建一个main.json文件，写入组件代码，我以按钮为例

{ "usingComponents": { "van-button": "/static/vant-weapp/button/index" }}

重点来了，只是新建了main.json在项目当中引入了，但是你需要的页面相对应的目录下面也需要加入你刚才新建的main.json，负责没有效果，我以首页为例展示

嗯，现在是引入了你需要的样式，但是代码报错，也就是我在最开始提出的Es6问题，报错如下:

关于以上问题，需要打钩ES6转ES5以及增强编译，勾选完需要在mavue里面执行npm run dev重启项目即可生效

npm run dev

好了，其实前期后后就是这么些问题，希望可以帮助开发路上遇到此类问题的伙伴，一起学习共同进步。

mpvue返回上一个页面_Mpvue+Vant-Weapp开发小程序遇坑之解决系列相关推荐

mpvue返回上一个页面_服务器出现404页面是什么情况了
服务器404页面是什么报错#服务器# 下面壹#服务器# 一:什么是404页面? 404页面是客户端在浏览网页时,服务器无法正常提供信息,或是服务器无法回应,且不知道原因所返回的页面.404错误信息通常 ...
mpvue返回上一个页面_小程序返回上一页 - 芊芊一隅
这个有点像子-->父传值第一步,在子页面点击上一步或者保存数据请求成功以后添加如下代码. 第二部,在父组件里的onshow生命周期里获取参数,对了,前提是需要你在data里建一个mydata对 ...
点击微信返回时重复提交表单php,微信小程序遇坑——多次点击页面重复加载及数据重复提交...
目前总结解决方法:同时需要设置模块的函数,函数都可放置在util.js中去. 首先: 一.在util.js中放入如下两组函数 1. 设置点击后多久不能再次操作该 function throttle(f ...
uni-app返回上一个页面并进行页面刷新
适用两个不同的页面跳转,返回上一个页面保存并刷新修改后的数据(也解决了uni-app的navigateBack返回不刷新的方法之一) 当前页: 上一页: 思路: 1.用getCurrentPages( ...
解决ios端返回上一个页面不刷新页面的问题
javascript返回上一个页面也许你会立马想到几种方案: 1.<a href="javascript:history.go(-1)">返回上一页</a> ...
Vue返回上一个页面时如何触发上一个页面的方法
Vue返回上一个页面时如何触发上一个页面的方法返回时是利用浏览器的缓存,我们可以利用route不一样来监听. 代码: watch: {$route(now, old) {// 判断逻辑if (now ...
禁止手机侧滑返回上一个页面的三种方法
禁止手机侧滑返回上一个页面的三种方法侧滑返回上一个页面用户体验很很好.但是在特别的场景侧滑返回上一个页面严重影响用户体验: 1.如正在斗地主,结果在出牌时,由于出最左边的牌时,不小心触发了侧滑离开斗 ...
java 返回上一个页面_页面返回上一页浏览位置
1.如果上一页是静态页面,可以用 history.go(-1)方法: go() 方法可加载历史列表中的某个具体的页面. 该参数可以是数字,使用的是要访问的 URL 在 History 的 URL 列表 ...
# js如何返回上一个页面
HTML通过内置js如何返回上一个页面 HTML通过内置js如何返回上一个页面这里列举三个js返回上一页的方法 1.通过 window.history.back()方法返回: 例如: <but ...

mpvue返回上一个页面_Mpvue+Vant-Weapp开发小程序遇坑之解决系列

mpvue返回上一个页面_Mpvue+Vant-Weapp开发小程序遇坑之解决系列相关推荐

最新文章

热门文章