基于uni-app的微信小程序之分包
作者:故事我忘了¢个人微信公众号:程序猿的月光宝盒
目录0. 缘由1. 关于分包1.0 这是 官方文档1.1 注意事项2.使用方法2.1 首先你得有个uniapp的微信小程序项目2.2 在pages同级创建分包2.3 pages.json配置2.4 然后呢,官网支持了 分包优化2.5 怎么跳转呢?2.6 然后重启微信开发工具运行
0. 缘由
最近工作在接触uni-app,用 ...
uni-app开发的app版本更新
标签: uni-app 版本更新
前情
uni-app是我很喜欢的跨平台框架,它能开发小程序,H5,APP(安卓/iOS),对前端开发很友好,自带的IDE让开发体验也很棒,公司项目就是主推uni-app。而是app版本更新是最基本的功能,特记录整个踩坑过程。
版本更新
更新主逻辑
在每次app启动并登录成功的时候做一个版本检测,如果当前版本小于服 ...
uni-app实战 | 第一篇:从0到1快速开发一个开源商城微信小程序,无缝接入Spring Security OAuth2认证授权实现登录
一. 前言
本篇通过实战来讲述如何使用uni-app快速进行商城微信小程序的开发以及小程序如何接入后台Spring Cloud微服务。
有来商城 youlai-mall 项目是一套全栈商城系统,技术栈是分布式微服务加上前后端分离模式,所以在本篇项目实战开始之前需要一些往期文章作为基础。
后台微服务
Spring Cloud实战 | 第一篇:Windows ...
Uni-App 启动页和引导页介绍
Uni-App 启动页和引导页介绍
Uni-App 启动页和引导页是两个不同的东西,启动页是 Uni-App 自带的,不可去掉,只能修改相关配置。而引导页完全是需要开发者自行开发的。
上面的图,就是Uni-App 启动页,那开发者可以对它进行哪些配置呢?
可以配置:1、是否等待首页加载完成在关闭启动界面
设置为true,则splash的关闭逻 ...
uni-app subNVue 原生子窗体简单使用案例(app端)
开头先放一些需要大概了解的官方文档链接地址
https://uniapp.dcloud.io/use-weex
https://uniapp.dcloud.io/api/window/subNVues
https://weex.apache.org/zh/docs/api/weex-variable.html
1、新建一个 uni-app 项目(使用 Hbuilder X)
2、项目结构如下( 在 pages 目录下的 index 目录 ...
uni-app 调用h5+接口,实现整包更新
// APP整包更新 //#ifdef APP-PLUS let thatProgress=this; console.log(thatProgress.progress) let server = this.constant.baseUrl+"/system-service/api/app/update"; //检查更新地址 plus.runtime.getProperty(plus.runtime.appid, function(widgetInfo) { uni.request({ url: server+' ...
[FE] uni-app Card 卡片组件 uni-card 用法
使用 uni-card 和其它组件没有什么区别,关注支持的属性和事件即可。
对于属性,需要特别注意值的类型,比如不要把非字符串的当做字符串处理。
举例,如下 is-full 需要 Boolean 类型,但是我们使用了字符串。
<uni-card
is-full="true"
:is-shadow="true"
...
uni-app实战教程
uni-app:学习使用门槛低,vuejs语法,一套代码多种编译方式多个平台运行,抛开这些兼容性不说,单单用来开发小程序也是最佳的选择
一:下载配置Hbuilder X
新建uni-app项目,包含模板,可选择支持scss语法
二:项目目录结构
components: uni-app组件目录
pages:项目文件目录
static:静态资源文件(图片、字体图标)
wxco ...
[FE] uni-app Grid 宫格组件 uni-grid 用法
文档上的描述是比较简陋的,不明所以。
核心就是两块内容,一个是 uni-grid 可以加 change 事件;另一个是 uni-grid-item 上面 index 属性值会作为 change 指定函数的参数一部分返回,格式是 {detail:{index:0}}
举例,局部代码如下:
<uni-grid :column="3" @change="gridClicked">
<uni- ...
uni-app 基本配置pages,json
{
// 打开页面的路径
"pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages
// 在第一位的事默认打开的页面
{
"path": "pages/message/message",
// 这是本页面的样式,这个样式权重大于全局
...
uni-app怎么使用路由守卫,并且路由配置和pages.json中只写一套
背景
uni-app本身没有路由,无法使用路由守卫。
那么有这么一个功能: 当某些页面需要登录,进入之前需要判断是否登录,如果没有登录则跳转到登录页。
可以封装公共方法或混入实现,但是不太优雅,这时使用路由守卫实在是太方便了!
幸好,插件uni-simple-router给我们提供了
1. uni-simple-router使用方法
uni-simple-rout ...
uni-app中使用svg
标签: svg js uni-app
前情
uni-app是我很喜欢的跨平台框架,它能开发小程序,H5,APP(安卓/iOS),对前端开发很友好,自带的IDE让开发体验也很棒,公司项目就是主推uni-app。
解决方案
最近在做一个需求,logo等png小图片在部分设备下会变糊,又不想做大图来缩放解决,于是考虑换成SVG,
uni-app目前不支持svg标签,只能通 ...
uni-app支付功能
扫码查看原文
前言
近期一直在使用APP开发多端应用,IOS的APP、安卓的APP和H5网页,其中开发的APP使用到了微信和支付宝的支付,在此给大家分享出来,一起使用
前置条件:
开发环境:windows
开发框架:uni-app , H5+,nativeJS
编辑器:HbuilderX 2.8.13
4.兼容版本:安卓,IOS已作测试 ...
uni-app下载文件在ios下失败
标签: js uni-app
前情
uni-app是我很喜欢的跨平台框架,它能开发小程序,H5,APP(安卓/iOS),对前端开发很友好,自带的IDE让开发体验也很棒,公司项目就是主推uni-app。
坑位
最近在做一个需求,需要在uni-app下载zip,word,pdf文件并打开浏览,发现在安卓下是正常的,但是在IOS下一直失败。
Why
其实是文件名用中文命名导 ...
uni-app页面title问题
问题:一开始在uni-app里pages.json的title怎么设置都显示首页
{
"path": "pages/completionPlan/index",
"style": {
"navigationBarTitleText": "计划",
"enablePullDownRefresh": true
}
},
解决方案:在页面的js里加入titleFix
import titleFix from "@/utils/mixins/titleFi ...
UNI-APP常用方法
1、判断第三方程序是否已存在
Boolean plus.runtime.isApplicationExist(appInf);
如果第三方程序已安装则返回true,未安装则返回false。
appInf: ( ApplicationInf ) 必选 要判断第三方程序的描述信息
Android平台需要通过设置appInf的pname属性(包名)进行查询。 iOS平台需要通过设置appInf的acti ...
uni-app 本地访问接口跨域
uni-app在本地访问接口跨域,可进行如下配置:
需要在manifest.json的源码中找到h5,添加以下代码:
"devServer" : {
"proxy" : {
"/dpc" : {
"target" : "****", //域名
"changeOrigin" : true,
"secure" : false,
...
uni-app引入vant weapp
之前做了一段时间的Android原生开发,发现我的布局实在是不堪入目,就想找一些开源的UI库。后来学习了Vue,就觉得Vue真的很好用,就想能不能用Vue开发android app,在网上找了半天,发现了uni-app,然后又找了一下UI库,听说vantui不错,就看了一下,果然挺好。但是在uni-app里面直接使用vantui是不可以的,因为它是针对h5 ...
分析uni-app菊花loading的纯CSS绘制
背景
继上拉加载——本着刨根问底的精神,挖了挖引用的uni-load-more组件,其实现比较容易理解,要说核心点,非CSS绘制的loading莫属了。小小的动画图,用到时直接引用就好了,不不不,千万不要这么想,所谓书到用时方恨少,可不是随口一说便成了千古名句的,没准哪天你就遇上了相关知识点,即使有万能度娘,也不能让你拥 ...
uni-app开发注意事项
关于vue
1、注意 如果使用老版的非自定义组件模式,即manifest中"usingComponents":false,部分模版语法不支持,但此模式已于2019年11月起下线。
2、data 必须声明为返回一个初始数据对象的函数;否则页面关闭时,数据不会自动销毁,再次打开该页面时,会显示上次数据。
3、class 支持的语法:
<view :class="{ active: isAc ...