基于uni-app全端弹框组件uaPopup「兼容h5+小程序+app端|nvue」
uniapp兼容多端自定义模态弹框组件UAPopup
ua-popup 一款轻量级的uniapp自定义弹窗组件。汇集了android、ios和微信弹窗效果(msg消息、alert提示框、dialog对话框、actionsheet底部动作框、toast轻提示、长按定位菜单)等功能。
如下图：H5+App端+小程序效果，亲测多端运行一致。
◆ 引入使用
▍在main.js中引入uapopu ...
uni-app中使用列表渲染v-for
在 v-for 里使用数组
v-for 指令可以实现基于一个数组来渲染一个列表。
v-for 指令需要使用 item in items 形式的特殊语法，其中 items 是源数据数组，而 item 则是被迭代的数组元素的别名。
第一个参数 item 则是被迭代的数组元素的别名。
第二个参数，即当前项的索引&nbs ...
uni-app 预览pdf文件
安卓uni-app实现pdf文件预览功能：
1.https://mozilla.github.io/pdf.js/getting_started/#download下载
放在根目录下，
2.新建一个webView页面
1 <template>
2 <view style="width: 100%;" >
3 <web-view :src="allUrl"></web-view>
4 </view>
5 </template>
6
7 <script>
8 export defa ...
uni-app app vue 小程序 RSA 加密/解密 使用 jsencrypt 踩坑(字符乱码问题)（二）
真是图样图样森破呀，接上篇：《uni-app app vue 小程序 RSA 加密/解密 使用 jsencrypt 踩坑(Message too long for RSA/Cannot read property 'appName')（一）》，
本以为后端RSA加密，前端进行解密这个风波是过去了，结果今天又发现了异常：
这是一段长数据解密后的json。
然而在格式化的时候，发现该json字符串里居然有 ...
uni-app app vue 小程序 RSA 加密/解密 使用 jsencrypt 踩坑(Message too long for RSA/Cannot read property 'appName')（一）
老弟的APP最近要重新改造，数据传输这一块要进行加密（虽然APP能反编译...不过有总比没有好）。
他后台用的是RSA加密，需要我uniapp的前端进行数据解密。
那就……开工吧：
【尝试一】
教程地址： https://www.cnblogs.com/sunnycc/p/13448670.html
把js下载下来，引入：
然后运行项目，结果发现报错： ...
uni-app h5使用百度地图
uni-app 生成h5时，默认使用的腾讯地图，且自带的map无法使用mapSearch组件。于是就有了通过web-view嵌入页面来实现。
现贴上使用百度地图获取经度和纬度的功能，供大家参考。
在static/html/map.html
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<meta http-e ...
uni-app修改favicon.ico
1.manifest.json文件
index.html文件（复制以下代码到index.html内）。需要重新运行才能看到效果，本地和发布路径不一样，记得改过来
这里有个小技巧，新建一个uni-app项目的demo，里面会有一个template.h5.html文件（自动生成的），把那个文件内容复制过来就行了
<!DOCTYPE html>
<html lang="zh-CN">
<head>
...
uni-app制作新手引导
新手引导一般用于新用户打开APP，引导用户使用的流程
实现思路，以uni-app为例，也是基于vue实现
1. 获取需要高亮元素的宽高以及left, top 使用 boundingClientRect 方法
2. 使用box-shadow 将其它区域遮盖住即可
具体步骤：
一、封装我们需要的数据
data () {
return {
guideList: [{
...
uni-app中小程序地图选点
最近在项目中要用到小程序地图选点，查了些许资料，特别在此记录一下，以便大家参考交流！，我选择用的是腾讯地图插件
实现效果：
1、去小程序开通腾讯腾讯位置服务
2、按照要求一步步操作，申请秘钥，添加项目 https://lbs.qq.com?lbs_invite=Y9PRFLY
3、选 ...
uni-app小程序云开发发送邮件
1、发件箱要开通POP3/SMTP服务
步骤：进入QQ邮箱，点击设置--账户--开启
开启服务后，获取授权码。
2、在注册后的小程序下开通云开发、创建环境
此步骤在微信开发者工具下操作。注意：要用注册过的APPID，测试号不行（无云开发环境）
1）在uni-app项目的mainifest.json中配置云 ...
uni-app 微信小程序分包优化
一、优化方案
1、开启--minimize压缩模式（针对vendor.js过大的情况可以使用运行时压缩代码）
HBuilderX创建的项目勾选运行-->运行到小程序模拟器-->运行时是否压缩代码
cli创建的项目可以在package.json中添加参数--minimize，示例：
"dev:mp-weixin": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli ...
uni-app如何使用vant-ui
1、前提：已经有uni-app项目
2、小程序版 Vant Weapp文档地址：https://youzan.github.io/vant-weapp/#/home
3、在项目中创建一个文件夹叫 wxcomponents，注意这个文件和pages文件夹平级。
4、前往https://github.com/youzan/vant-weapp下载压缩文件，将该项目的dist文件夹替换wxcomponents => vant下的dist文件夹
5、在根 ...
uni-app权限设置参数详情
uni-app权限设置参数详情
补充安卓：
用于进行网络定位: android.permission.ACCESS_COARSE_LOCATION
用于访问GPS定位: android.permission.ACCESS_FINE_LOCATION
获取运营商信息，用于支持提供运营商信息相关的接口: android.permission.ACCESS_NETWORK_STATE
用于访问wifi网络信息，wi ...
uni-app 获取 cookie 问题
在 PC 端的时候，对于后端返回的 cookie 我们是不用进行处理的。
浏览器会自动读取 response header 中的 set-cookie 信息保存，并在后续的 request 中带上。
但是在做小程序时，由于不能自动解析、带上 cookie 所以需要自己手动处理 cookie。
在使用 uni-app 时，uni.request 的 success 返回的参数有下面两个可以读 ...
uni-app全栈仿微信开源项目系列(三)
8.聊天信息设置页开发
1、新建页面chat-set.nuve
2、给chat.nvue中的free-icon-button组件绑定点击事件让其跳转到chat-set.nvue页面中。
3、编写chat-set.nvue页面的导航栏。
期间对导航栏组件做了下面优化。
新增showRightprops属性用于控制是否显示导航栏右侧图标以及弹出菜单
具体代码改动参考commits。
3、编写聊 ...
uni-app
1.简介
uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉/淘宝）、快应用等多个平台。
2.开发（混合开发注意点）
工具：HBuilderX 官网下载：https://www.dcloud.io/hbuilde ...
uni-app 微信支付
小程序 支付
先看官方文档 https://pay.weixin.qq.com/wiki/doc/apiv3/open/pay/chapter2_8_2.shtml
知晓有那些比不可少的流程，之后后端确定返回的参数值，用于前端支付。参数值必须一一对应，不然支付会失败
uni.requestPayment({
timeStamp: data.timeStamp, //当前的时间
nonceStr: data.nonceStr, / ...
uni-app中动态设置头部颜色及字体
应用场景：
需要根据后台设置不同项目的主题色，头部相应的出现颜色，查看我们的uni-app开发文档，发现我们可以用2种方法来实现。
方法一：
我们可以使用
uni.setNavigationBarTitle(OBJECT) 动态设置当前页面的标题
uni.setNavigationBarColor(OBJECT) 动态设置颜色跟背景色
以上2个具体用 ...
uni-app 第三方授权登录
注意:在使用uni-app第三方登录时采用的是手机真机调试
授权登录html
<view type="primary" class="login_type" v-for="(value,key) in providerList" @click="tologin(value)"
:key="key">
<view class="login_type_name">{{value.name}}</view>
</view>
<script>
import {
mapState ...
uni-app&H5&Android混合开发二 || 使用Android Studio打包应用APK
前言：
在上一章节我们已经讲了如何uni-app离线打包Android平台教程，这一章就该来讲讲如何使用Android Studio打包应用APK提供给Android手机安装使用了。
uni-app跨平台框架介绍和快速入门
uni-app跨平台框架介绍和快速入门
第一步、首先打开已经编译好的Android项目：
第二步、选择Build>Generate Signed APK or A ...
