- 综合排序
- 最热优先
- 最新优先
- 来自专栏码客
uni-app小程序开发
NVUE uni-app App 端内置了一个基于 weex 改进的原生渲染引擎，提供了原生渲染能力。 只建议用于APP的开发，不建议用于小程序的开发。 小程序 小程序底层还是基于Webview+原生来实现的。 小程序的UI视图和逻辑处理是用多个Webview实现的，逻辑处理的JS代码全部加载到一个Webview里面，称之为AppService，整个小程序只有一个，并且整个生命周期常驻内存。 所以一个小程序打开至少就会有2个webview进程，正式因为每个视图都是一个独立的webview进程，考虑到性能消耗，小程序不允许打开超过5个层级的页面，当然同是也是为了体验更好。 如图： uni-app uni-app 是一个使用 Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条
51210编辑于 2024-05-15 - 来自专栏码客
uni-app小程序开发-分包
前言 小程序的图片类资源放服务器里，然后src放网络路径来显示。 什么时候使用分包 对体积较大的小程序项目，建议使用此功能。 如果小程序由不同的团队协作开发，建议使用此功能。 查看分包大小 支付宝小程序分包大小限制： 整个小程序所有分包大小不超过 8MB。 单个分包或主包大小不能超过 2MB。 那么我们怎样查看分包的大小呢。 分包(main)大小过大, 实际大小(6873kb)超过(4096kb)限制 所以 小程序的图片类资源放服务器里，然后src放网络路径来显示。 比如支付宝小程序就不支持分包优化，就不用配置分包优化，也是可以分包的。
77310编辑于 2024-08-02 - 来自专栏码客
uni-app小程序开发-组件
backgroundColor": "#f8f8f8" }, 导航条颜色一般是通过navigationBarTextStyle配置 导航栏标题颜色及状态栏前景颜色，仅支持 black/white 但是支付宝小程序不支持 widthFix 宽度不变，高度自动变化，保持原图宽高比不变 缩放 heightFix 高度不变，宽度自动变化，保持原图宽高比不变App 和 H5 平台 HBuilderX 2.9.3+ 支持、微信小程序需要基础库 "></view> </swiper-item> <swiper-item> <view class="swiper-item <em>uni</em>-bg-green"></view> .uni-bg-blue { background-color: blue; } } 输入类组件 输入框 <input class="<em>uni</em>-input 只要组件安装在项目的components目录下或<em>uni</em>_modules目录下，并符合components/组件名称/组件名称.(vue|uvue)目录结构，就可以不用引用、注册，直接在页面中使用。
44410编辑于 2024-07-22 - 来自专栏web技术开发分享
uni-app小程序开发记录
前言：最近在用uni-app学习并开发一些小应用， 顺便记录下开发和学习过程中遇到的一些坑，方便以后避免 1.uni-swiper-dot 轮播图 设置默认值的坑：需要在swiper上设置current 默认值才生效 完整代码： <uni-swiper-dot :info="info" :current="current" field="content" :mode="mode"> paperImg" :src="item.cover_image" alt /> </view> </swiper-item> </swiper> </uni-swiper-dot app-plus": { //app配置自定义导航 "titleNView": false //app禁止使用原生导航 } } }, 3.小程序取消顶部的导航条
54710编辑于 2022-08-11 - 来自专栏『学习与分享之旅』
【UniApp】-uni-app-打包成小程序
趁热打铁，在来一篇文章，给大家详细的介绍如何将项目打包为小程序。 正文打开微信小程序呢，其实还是需要进行一些相关的配置的首先打开微信小程序的配置页面找到 manifest.json 文件打开 manifest.json 之后找到 微信小程序配置配置微信小程序AppID ，就可以进行发行了，点击 HBuilderX 工具栏中的 发行 -> 小程序-微信(仅适用于uni-app)：点击了之后再弹出来的弹框中，只要你之前配置好了微信小程序的内容，会自动为你填充，直接点发行： 打包之后会自动给你打开微信小程序开发工具：当我运行起来之后发现，输入框的样式有问题，我来一张图来对比一下网页VS小程序：尺寸和网页版的不一样，不对的话这里我需要修复一下，这里就是 UniApp 的一些坑 都弄完之后只需要点击微信小程序工具中，右上角的 上传:上传之后在回到小程序的官网：https://mp.weixin.qq.com/，登录自己的账号，选择小程序登录而不是公众号，关于账号的注册等知识这里不介绍
1.3K20编辑于 2023-12-24 - 来自专栏wfaceboss
uni-app开发小程序准备阶段
/miniprogram/dev/devtools/download.html 支付宝小程序开发工具安装 https://docs.alipay.com/mini/ide/download 百度小程序开发工具安装 ，这里对浏览器运行配置与小程序运行配置做个简单说明，至于手机/模拟器运行配置后期更新。 2.2小程序运行配置 uni-app是依赖小程序开发工具的，在配置时需指定小程序开发工具的安装目录。 比如此时我的微信小程序开发工具安装路径为： ? HBuilderX 中配置为： ? 同理，百度开发工具路径、支付宝小程序开发工具、字节跳动小程序开发工具路径的配置与微信小程序配置方式相同，参照其即可。 3. 编辑器设置 点击工具栏里的工具 -> 设置->编辑器配置： 然后在打开的编辑器设置右侧中，找到【启用px转upx提示】（uni-app项目生效）,填写px转upx比例。
1.1K00发布于 2019-04-18 - 来自专栏码客
uni-app小程序开发-HBuilderX配置
前言 开发uni-app时最好用的IDE还是HBuilder X，尽管它有很多小问题。 开发Uni-App最好的IDE https://www.dcloud.io/hbuilderx.html 界面字体太小 界面字体太小的解决方法 格式化 默认的格式化插件不好用 scss/less文件默认不会被格式化
41410编辑于 2024-07-31 - 来自专栏达达前端
微信小程序优化uni-app
image.png components uni-app组件目录 hybrid 存放本地网页的目录 platforms 存放各平台专用页面的目录 wxcomponents 存放小程序组件的目录 用来配置App全局样式以及监听 manifest.json 配置应用名称、appid、logo、版本等打包信息 pages.json 配置页面路由、导航条、选项卡等页面类信息 onLaunch 当uni-app 初始化完成时触发 onShow 当uni-app启动，或从后台进入前台显示 onHide 当uni-app从前台进入后台 css, less/scss等资源同样不要放在static目录下 onUniNViewMessage ，返回 event = {from:backbutton、 navigateBack} ，backbutton 表示来源是左上角返回按钮或 android 返回键；navigateBack表示来源是 uni.navigateBack Number 原生标题栏按钮数组的下标 onBackPress from String 触发返回行为的来源：'backbutton'——左上角导航栏按钮及安卓返回键；'navigateBack'——uni.navigateBack
2.9K10发布于 2019-09-19 - 来自专栏加菲猫的VFP
Uni-app+VFP开发小程序分享
四．前端页面数据渲染 原理：使用v-if判断 1.当文章内容中图片小于3张时，显示标题，一张大图 2.当文章内容中图片大于等于3张时，显示标题，三张小图 五．云打包，生成apk文件，可在安卓系统上安装 六．编译小程序，发布公网
90310编辑于 2022-04-07 - 来自专栏Web前端
uni-app开发微信小程序
需求分析随着移动互联网的发展，微信小程序已经成为了一种非常流行的应用形式。uni-app 是一种使用 Vue.js 开发所有前端应用的框架，它支持一次开发多端部署，包括微信小程序、H5、App 等。 本文将详细介绍如何使用 uni-app 开发微信小程序，并通过一个简单的示例来展示整个开发过程。主要需求点用户登录：支持微信授权登录。商品列表：展示商品信息。商品详情：展示商品详情信息。 使用 HBuilderX 创建一个 uni-app 项目。 backgroundTextStyle": "light", "navigationBarBackgroundColor": "#fff", "navigationBarTitleText": "微信小程序商城 总结通过本篇博客，我们详细介绍了如何使用 uni-app 开发微信小程序，并通过一个简单的示例展示了整个开发过程。uni-app 的优势在于它可以一次开发多端部署，极大地提高了开发效率。
78110编辑于 2024-09-07 - 来自专栏用户7873631的专栏
全流程：安装uni-app(小程序端)
->新建-->项目--->) 5在HBuilderX里面打开App.vue文件(这步是在第六步之前必须做的哦) 6.HBuilderX里面（工具---->设置----》运行配置---->） 7.在微信小程序中 (成功啦) ---- 前言 从零开始运行一个简单的uni-app小程序端 一、uniapp是什么？ 是一个使用Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序、快应用等多个平台。 文件—>新建–>项目—>) 5在HBuilderX里面打开App.vue文件(这步是在第六步之前必须做的哦) 6.HBuilderX里面（工具---->设置----》运行配置---->） 7.在微信小程序中
1.4K10编辑于 2022-09-23 - 来自专栏前端技术开发
uni-app开发小程序入门到崩溃
最近一段时间公司要做一个小程序项目，还要支持，微信小程序，头条小程序，百度小程序。一套代码，实现三个平台。 最后说说uni-app，也是在项目中选择使用了uni-app,真是的以进入uni-app这个框架，就相等与调入虎口一样，踩不完的坑，写不完的bug，但是主要这个语法简单，基于vue，可以说会vue和小程序 ，就很容易上手，直接可以开发项目， uni-app编写运行三个平台，只对微信小程序编译运行的是最好的，但是头条和百度，必须是手动打开才能可以，第一次编译也不一定能编译成功，编译之后，app.js文件丢三落四 1.代码编译之后 第一次编译每个平台的小程序，就会发现，头条小程序app.js文件，少引入了三个重要的文件，而且app.json配置文件也没有，无论怎么编译都无动于衷，最后没有办法，只有把其他代码直接拷贝 2.官方api方法 在项目中会用到各种api来协助开发，但是你会发现，好多api对支付宝小程序不支持，这个地方就有一个坑了，头条小程序选择上传视频，通过调用uni.chooseVideo提供的的api,
2.3K20发布于 2019-12-10 - 来自专栏码客
uni-app小程序开发-生命周期
生命周期 https://uniapp.dcloud.net.cn/tutorial/page.html#lifecycle 应用生命周期 应用生命周期是指应用程序从启动到关闭的整个过程，包括应用程序的启动 Uniapp提供了以下生命周期钩子函数： onLaunch：应用程序启动时触发，仅在应用程序第一次启动时触发。 onShow：应用程序进入前台时触发，可以获取到应用程序被打开的方式和场景值。 onHide：应用程序进入后台时触发。 onError：应用程序发生错误时触发，可以用来捕获和处理错误信息。 组件生命周期 组件生命周期是指组件从创建到销毁的整个过程，包括组件的创建、更新、销毁等。 页面生命周期 uni-app 页面除支持 Vue 组件生命周期外还支持下方页面生命周期函数。 页面生命周期是指页面从创建到销毁的整个过程，包括页面的创建、显示、隐藏和销毁等。
73410编辑于 2024-07-23 - 来自专栏码客
uni-app小程序开发-支付宝小程序一键登录
常用地址 开放平台 https://open.alipay.com/develop/manage 创建小程序 https://open.alipay.com/develop/mini/create? bundleId=com.alipay.alipaywallet&from=createMenuPage 小程序API https://opendocs.alipay.com/mini/api/ 获取手机号 https://opendocs.alipay.com/mini/api/getphonenumber 小程序获取手机号 页面中 <! String encryptType = "AES"; String signContent = content; String signVeriKey = "你的<em>小</em><em>程序</em>对应的支付宝公钥 （为扩展考虑建议用appId+signType做密钥存储隔离）"; String decryptKey = "你的<em>小</em><em>程序</em>对应的加解密密钥（为扩展考虑建议用appId+encryptType
1.4K10编辑于 2024-05-21 - 来自专栏第一专栏
语法速通 uni-app随笔【uni-app】【微信小程序】【vue】
1、微信小程序 1.1、wx 小程序 工程目录 其中， pages目录/index目录【必有】： index.js 编写业务逻辑 【初始数据，生命周期函数】 index.json 编写配置 index.wxml 编写模板 【可理解为本页html】 index.wxss 【可理解为本页css】 1.2、wx 小程序 标签 直接输入关键词敲回车，连尖括号都不需要就可以标签补全
—> <view>—><image> —> <text> —> <navigator> 1.3、wx 小程序 数据绑定 1）初始数据写死 在index.wxml 引入变量用 {{}} 参见 H5 单页面写脚本和样式的理解 2）组件标签靠近小程序规范 标签和微信小程序同
—> <view>—><image> —> <text> — > <navigator> × —> <uni-link> 3）接口能力（JS API）靠近微信小程序规范 4）数据绑定及事件处理同VUE.js 规范 （妹学 Vue） 5）为兼容多端运行
61440编辑于 2023-05-25来自专栏全栈开发工程师【Uni-App社区小程序】008-底部导航
https://uniapp.dcloud.net.cn/collocation/pages?id=tabbar
28410编辑于 2025-01-06来自专栏编程进阶实战微信小程序转化为uni-app项目
前言： 之前自己做一个uni-app的项目的时候前端需要实现一个比较复杂的动态tab和swiper切换的功能，但是由于自己前端抠脚的原因没有写出来，然后自己在网上搜索的时候发现了有个微信小程序里面的页面及极其的符合我的需求 那么问题来了我该如何将微信小程序转为为uni-app项目呢？ 搜索了下网上的相关解决方案还真有个将微信小程序转化为uni-app的项目，该项目名称叫做【miniprogram-to-uniapp】，接下来就看看如何实操吧！ 第三步、使用miniprogram-to-uniapp将微信小程序转化uni-app实例： 首先下载需要转化的微信小程序： 为了示范随便下载了一个微信小程序商城，项目地址为：https://github.com 运行以下命令将微信小程序转化为uni-app项目： 在命令行里，输入【wtu -i "你的小程序项目路径"】，注意-i后面有个空格！！！
2K20发布于 2020-06-19来自专栏码客uni-app小程序开发常用配置项配置
： 属性 类型 默认值 描述 平台差异说明 navigationBarBackgroundColor HexColor #F8F8F8 导航栏背景颜色（同状态栏背景色） APP与H5为#F8F8F8，小程序平台请参考相应小程序文档 custom即取消默认的原生导航栏，需看使用注意 微信小程序 7.0+、百度小程序、H5、App（2.0.3+） titleImage String 导航栏图片地址（替换当前文字标题），支付宝小程序内必须使用 支持 always 一直透明 / auto 滑动自适应 / none 不透明 支付宝小程序、H5、APP titlePenetrate String NO 导航栏点击穿透 支付宝小程序、H5 页面内容 uni-app 支持的通用 css 单位包括 px、rpx px 即屏幕像素。 vue 页面支持下面这些普通 H5 单位，但在 nvue 里不支持： rem: 根字体大小可以通过 page-meta 配置抖音小程序和飞书小程序：屏幕宽度/20、百度小程序：16px、支付宝小程序：50px
79810编辑于 2024-07-11来自专栏全栈开发工程师【Uni-App社区小程序】015-列表渲染
v-for 指令需要使用 item in items 形式的特殊语法，其中 items 是源数据数组，而 item 则是被迭代的数组元素的别名；
16400编辑于 2025-01-06来自专栏ECS服务器CLI 发行uni-app到微信小程序
CLI 发行uni-app到微信小程序 HBuilderX 3.3.7-alpha，支持使用CLI发行微信小程序。 通过此种方式，可在命令行或其它CI工具中，完成微信小程序代码的上传、预览等操作。 同时需要升级 微信小程序上传CI插件 # 仅编译uni-app项目到微信小程序 cli publish --platform mp-weixin --project 项目名称 # 编译uni-app项目到微信小程序 true --appid 小程序appid --description 发布描述 --version 发布版本 --privatekey 小程序上传密钥文件 --robot 2 小程序代码上传密钥 HBuilderX 3.3.7+, uni-app 发行到微信小程序，支持自动上传代码到微信平台，无需再通过微信开发者工具上传发行。 详情 HBuilderX 发行微信小程序，需要提供微信小程序代码上传密钥 通过微信小程序CI，使用上传密钥上传代码，无需打开微信开发者工具，一键完成微信小程序代码的上传、预览等操作。
86710编辑于 2023-04-18
腾讯云开发者
