楼主是使用vue-cli构建的页面,代码是vscode,然后使用hbuilder打包成移动端的安装包.首先确认在npm run build 之后没有问题(默认dist文件夹),可以使用anywhere开一个服务器看看. 在确保咩有问题的情况下,将dist文件夹直接拖进 hbuilder (hbuilder下载地址)中, ,在dist上面右击,点击 转换成移动app,dist的图标会由 W 变成 A,如图: ,dist文件夹中会新增manifest.json(这个是app的配置文件,修改app图标

上一次讲到如何创建一个应用,今天讲下如何在手机端预览项目. 1.下载 AppLoader 下载地址:https://docs.apicloud.com/Download/download#apploader 2.打开编辑器,点击 帮助--->WIFI真机同步 IP 和 端口 3.打开第1步下载的AppLoader,点击小圆球,在弹出的框中填写你的 IP 和 端口号 4.打开编辑器,上传你的代码 第一次:选中项目 --->右键 ---> WIFI全量同步. 代码上传完成,以后你更改代码选择

微信小程序中出现最多的一个问题,就是真机跟本地不同:我简单列举一些我发现的原因,给大家参考,大家也可以把自己发现的东西回复给我,给我参考: 本地看不到数据,就先让本地能看到数据,再看本帖....特别提示:当问题较为复杂时,请制作一个专门的最简demo,以便集中观察,确定问题. 看帖前需测试内容:测试内容一:请同时测试安卓及ios至少各两款手机型号:测试内容二:开发者工具内开启不检验域名,真机上打开调试进行测试:查看结果:                    然后开发者工具上关闭不检验域名,真机

微信小程序中出现最多的一个问题,就是真机跟本地不同:我简单列举一些我发现的原因,给大家参考,大家也可以把自己发现的东西回复给我,给我参考:本地看不到数据,就先让本地能看到数据,再看本帖.... 1:本地可以看到数据,ios不行,安卓可以:     可能是tsl版本问题不支持1.2导致,部分安卓可以允许tsl低于1.2而正常显示,而苹果不行:     解决方法:参考此帖排查问题并修复:request:fail错误(含https解决方案)(真机预览问题     可能是证书不受信任 2:本地可以看到数

需求:当点击图片时,当前图片放大预览,且可以左右滑动 实现方式:使用微信小程序图片预览接口 我们可以看到api需要两个参数,分别通过下面的data-list和data-src来传到js中 wxml代码: <!--图片描述--> <view wx:if="{{item.pictures}}" class="list-dImg"> <image bindtap="imgYu" data-list="{{item

一.小知识 二.例子,配合轮播图使用效果更佳!(如图1) 1.wxml <scroll-view scroll-y="true"> <swiper catchtap="onSwiperTap" autoplay="auto" interval="3000" duration="500" current="{{swiperCurrent}}" bindchange=&qu

wxml页面: <image src='{{UPLOAD_IMAGES_URL}}{{vv.img_s}}' data-src="{{vv.img}}" bindtap="previewImage"></image> js: /*预览*/previewImage:function(e){ console.log('previewImage'); var current = e.currentTarget.dataset.src; var th

https://github.com/Tencent/weui-wxss 用微信web开发者工具打开dist目录(请注意,是dist目录,不是整个项目)

版权声明:本文由贺嘉 原创文章,转载请注明出处: 文章原文链接:https://www.qcloud.com/community/article/431172001487671163 来源:腾云阁 https://www.qcloud.com/community 如何用Baas快速在腾讯云上开发小程序-系列4:实现客户侧商品列表.商品详情页程序 一.实验简介通过实现商品列表.商品详情页程序,熟练掌握云端数据表查询操作. 二.实验目标 掌握小程序调试方法 掌握小程序操作云端数据方法 掌握云端数据表

前段时间,美团开源了mpvue这个项目,使得我们又多了一种用来开发小程序的框架选项.由于mpvue框架是完全基于Vue框架的(重写了其runtime和compiler),因此在用法上面是高度和Vue一致的(某些功能由于受限于小程序环境本身的原因而不能使用),这给使用过Vue开发Web应用的前端开发者提供了极低的切换门槛来开发小程序. 如果之前还未曾用过Vue这个框架的话,建议你可以快速浏览一下Vue的官方文档(https://cn.vuejs.org/v2/guide/) 起手式:必要的开发环境

在上篇文章中,我们介绍了使用mpvue开发小程序所需要的一些开发环境的搭建,并创建了第一个mpvue小程序代码骨架并将其运行起来.在本文中,我们来研究熟悉一下mpvue项目的主要目录和文件结构. 在Visual Studio Code里面打开项目文件夹,我们可以看到类似如下的文件结构: firstapp ├── package.json ├── project.config.json ├── static ├── src │ ├── components │ ├── pages │ ├── ut

在上一篇文章中,我们熟悉了一下通过vue-cli生成的mpvue工程代码骨架的基本结构,大致了解了每一个部分的代码到底要放到何处.从本文起我们就开始涉及真正的编码部分,学习使用Vue的语法去编写小程序. 为了清楚起见,我们将要对vue-cli生成的代码做一个清理工作,具体如下: 删掉src/components.src/pages.src/utils三个目录下的所有代码文件 将src/App.vue文件中的内容重置成: <script> export default {} </scrip

在上一章节中,我们将vue-cli命令行工具生成的代码骨架中的src目录清理了一遍,然后从头开始配置和编写了一个可以运行的小程序页面,算是正真走上了使用mpvue开发小程序的第一步.今天我们将进一步来了解和学习mpvue / Vue的其他重要功能. 既然mpvue是基于Vue的,那么就没有理由不进一步学习一下Vue最核心的东西:组件.组件系统是Vue应用开发中最具价值的特性之一,在前文中其实我们就已经有在使用组件了,比如App.vue和首页index.vue就是两个Vue组件. 组件是一种抽象,

在上一章节中,我们了解了组件的三个基本特性以及组件的基本使用方法.在实际的小程序开发中,我们应该以组件的思维去设计每个小程序的功能页面,对其进行合理的组件拆分,让每个部分都保持功能简洁.条理清楚.各司其职,这样会让代码变得更易理解和维护,间接的也提升了代码的健壮性,降低出现Bug的几率,即使出现Bug,也会更容易进行定位和调试.   由于mpvue采用的是Vue框架的基础设施,所以大部分的功能都是和Vue一致的.但是,mpvue的代码毕竟最终还是要转译成小程序原生框架下的代码的,由于小程序框架本

这里记录一下  使用wepy框架和  vant-weapp库开发小程序废话 不多说 wepy文档: https://tencent.github.io/wepy/document.html#/ vant-weapp 文档 https://youzan.github.io/vant-weapp/#/quickstart1 安装环境全局安装或更新WePY命令行工具 wepy init standard myproject   (1.7版本以后) 切换至项目目录 cd myproject 安装依赖 n

wepy开发小程序使用getApp().globalData保存全局数据很方便,但是会在控制台看到很多报错:“error 'getApp' is not defined no-undef”,这是eslint报错. 解决办法:在.eslintrc.js文件中加入   globals: { getApp: true }

前言: 最近接到小程序的开发需求,由于之前也没开发过小程序,心情还是有点激动.先花15分钟看一遍小程序官方文档,再花10分钟看一遍mpvue官方文档,然后拿着原型图和UI图就开干.踩了不少坑,写篇博客记录一下.PS:小程序官方文档地址:https://developers.weixin.qq.com/miniprogram/dev/ ,mpvue官方文档: http://mpvue.com/ mpvue: mpvue 是一个使用 Vue.js 开发小程序的前端框架.框架基于 Vue.js 核心,

本文来自网易云社区. Mpregular 是基于 RegularJS(简称 Regular) 的小程序开发框架.开发者可以将直接用 RegularJS 开发小程序,或者将现有的 RegularJS 应用通过较少修改移植到小程序上.Mpregular 为 RegularJS 开发者提供了一套跨 h5 和小程序的前端应用解决方案,让开发者能在不同平台有一致的开发体验和开发效. 0 序 以下是使用 mpregular 前后的效果对比 旧版(原生小程序) &lt;img src="https:/

微信小程序红包开发 小程序发红包 开发过程中遇到的坑 微信小程序红包接口的   最近公司在开发一个小程序红包系统,客户抢到红包需要提现.也就是通过小程序来给用户发红包. 小程序如何来发红包呢?于是我想到两个方法. 之前公众号开发一直用了的.一个是红包接口,一个是企业支付接口.一开始还是想着用红包接口吧,毕竟有一个点击拆的事件,让用户参与.然后各种坑就来了... 小程序里如何给用户发红包?拿到了小程序的openid有办法获取到这个用户的公众号openid吗? 在小程序里拿到了用户的openid,但

Java生鲜电商平台-优惠券功能设计与开发(小程序/APP) 说明:Java生鲜电商平台-优惠券功能设计与开发(小程序/APP) 目录 1.项目背景与需求分析 2.需求目的与功能点列表 3.业务逻辑 4.业务流程 5.页面流程 6.原型设计 7.数据指标 1.项目背景与需求分析 1.1 背景 日日鲜是一个基于B2C的生鲜电商小程序,由于公司推广需求,现在需要设计一个针对新老用户发送优惠券的H5界面,用于微信里用户自发的分享传播 1.2需求分析     1.3 需求点归纳     1.4需求点优先

写在前面 刚刚开源的mpvue引起了不少前端er们的注意,下图是一个简单的对比. 话不多说,我们现在感受一下如何使用mpvue开发小程序.(以下内容参照mpvue文档完成). 开发环境 node npm:这里建议安装淘宝镜像 微信开发者工具 操作顺序 首先下载vue-cli npm install -g vue-cli 使用vue-cli创建一个mpvue项目 vue init mpvue/mpvue-quickstart my-project 创建的过程中会有一些设置,包括项目名称,作者等等内