uni-app实现生成海报
示例图:
文献参考:
参考文档:https://zhuanlan.zhihu.com/p/597629702
uni-app官网:uni.createSelectorQuery() | uni-app官网
微信小程序官网:canvas | 微信开放文档
海报内容准备:
1、背景图片
2、二维码
3、用户头像,用户名称
4、简短的描述文案
PS:
1、若使用<canvas type="2d" id="myCanvas"></canvas> 则报 ...
uni-app+vue3+ts项目搭建完整流程
项目代码同步更新至码云 uni-vue3-ts-template
开发前准备
利用 uni-app 开发,有两种方法:
通过 HBuilderX 创建(需安装 HBuilderX 编辑器)
通过命令行创建(需安装 NodeJS 环境),推荐使用 vscode 编辑器
这里我们使用第2种方法,这两种方法官方都有详细介绍 点击查看官方文档
vscode 安装插件
安装 Vue3 插件, ...
uniapp-welive仿微信/抖音直播带货|uni-app+vue3+pinia短视频直播商城
基于uniapp+vue3+uv-ui跨端H5+小程序+App短视频+直播带货商城Uniapp-WeLive。
uni-welive一款全新基于uniapp+vue3+pinia+vk-uview等技术跨端仿制抖音/微信直播带货商城项目。支持沉浸式全屏上下滑动短视频直播,Nvue多视频层级覆盖,支持编译到兼容H5+小程序+App端。
预览效果
编译H5+小程序+App端效果如下
使用技术
编辑 ...
【UniApp】-uni-app-打包成网页
前言
经过上一篇文章的介绍,已经将这个计算器的计算功能实现了,接下来就是我们项目当中的一个发包上线阶段,我模拟一下,目的就是为了给大家介绍一下,uni-app是如何打包成网页的。
除了可以打包成网页,uni-app还可以打包成小程序、App、H5、快应用等等,后面在单独开文章详细介绍。
正文
接着上篇文章的项目来进行,首 ...
【UniApp】-uni-app-自定义组件
前言
经过上个章节的介绍,大家可以了解到 uni-app-网络请求的基本使用方法
那本章节来给大家介绍一下 uni-app-自定义组件 的基本使用方法
原本打算是直接写项目的,在写项目之前还有个内容需要我在码一篇文章,所以就先码这篇文章了
本章节的内容比较简单,大家可以快速的过一遍,然后在项目中使用
就是自定义组件,虽然 ...
【UniApp】-uni-app-pinia存储数据
前言
经过上个章节的介绍,大家可以了解到 uni-app-数据缓存 的基本使用方法
那本章节来给大家介绍一下 uni-app-pinia存储数据 的基本使用方法
经过我这么多篇章的介绍,我发现大家环境比较耗时,所以在今后的文章中,我会尽量减少环境的搭建
如果某一篇的文章环境确实是不一样的,我会在文章中说明,然后编写对应的搭建 ...
【UniApp】-uni-app-数据缓存
前言
好,经过上个章节的介绍完毕之后,给大家补充了一下 uni-app-数据传递的内容
那么补充了 uni-app-数据传递的内容之后,这篇文章来给大家介绍一下 uni-app-数据缓存
搭建项目
首先我们还是要先搭建一个项目,这里我就不多说了,大家可以参考上一篇文章
搭建好项目之后,我们就可以开始我们的正文了
步入正题
首先 ...
【UniApp】-uni-app-传递数据
前言
好,经过上个章节的介绍完毕之后,了解了一下 uni-app-路由
那么了解完了uni-app-路由之后,这篇文章来给大家介绍一下 uni-app-路由传递数据
路由传参怎么传,是不是可以从 A 页面传递给 B 页面,然后 B 页面再传递给 C 页面, 也可以从 C 页面传递给 B 页面,然后 B 页面再传递给 A 页面(可以顺着传也可以逆着传递 ...
【UniApp】-uni-app-路由
前言
好,经过上个章节的介绍完毕之后,了解了一下 uni-app-CompositionAPI应用生命周期和页面生命周期
那么了解完了uni-app-CompositionAPI应用生命周期和页面生命周期之后,这篇文章来给大家介绍一下 uni-app-路由
前面我还说过,除了有应用程序的生命周期和页面的生命周期以外,其实还有组件的生命周期,组件的生命 ...
【UniApp】-uni-app-修改组件主题和样式
前言
好,经过上个章节的介绍完毕之后,了解了一下 uni-app-扩展组件
那么了解完了uni-app-扩展组件之后,这篇文章来给大家介绍一下 uni-app-修改组件主题和样式
首先不管三七二十一,先来新建一个项目
搭建演示环境
创建一个全新的项目,因为本文要修改组件主题和样式,所以这次创建项目选择 uni-ui 模板:
然后在配置 ...
【UniApp】-uni-app-扩展组件
前言
好,经过上个章节的介绍完毕之后,了解了一下 uni-app-内置组件
那么了解完了uni-app-内置组件之后,这篇文章来给大家介绍一下 UniApp 中的扩展组件
首先不管三七二十一,先来新建一个项目
搭建演示环境
创建一个全新的项目:
然后在配置一下,微信小程序的 AppId,直接去之前的项目中拷贝一下即可,找到之前项目 ...
【UniApp】-uni-app-内置组件
前言
好,经过上个章节的介绍完毕之后,了解了一下 uni-app-全局数据和局部数据
那么了解完了uni-app-全局数据和局部数据之后,这篇文章来给大家介绍一下 UniApp 中内置组件
首先不管三七二十一,先来新建一个项目
搭建演示环境
创建一个全新的项目:
然后在配置一下,微信小程序的 AppId,直接去之前的项目中拷贝一下 ...
【UniApp】-uni-app-全局数据和局部数据
前言
好,经过上个章节的介绍完毕之后,了解了一下 uni-app-全局样式和局部样式
那么了解完了全局样式和局部样式之后,这篇文章我再来给大家介绍一下 UniApp 中全局数据和局部数据
搭建演示环境
创建一个全新的项目:
然后在配置一下,微信小程序的 AppId,直接去之前的项目中拷贝一下即可,找到之前项目的 manifest.js ...
【UniApp】-uni-app概述
前言
好,经过我们前面文章的编写,大家可以了解到微信小程序开发相关的知识,了解完了这个微信小程序开发和云开发之后,从这篇文章开始,我再来给大家写一下关于 Uniapp 的知识。
好,开始,那什么是 Uniapp 呢?这个时候我们不管三七二十一,先打开我们 Uniapp 官方文档,它官方地址也很简单,叫做 dcloud.io:
这就是 ...
【UniApp】-uni-app全局样式和局部样式
前言
好,经过上个章节的介绍完毕之后,了解了一下 UniApp 的一个全局 页面配置文件,也就是我们的一个 pages.json 文件。
那么了解完了这个文件之后,这片文章,再了解一下 UniApp 的一个全局样式和我们的局部样式。
搭建演示环境
创建一个全新的项目:
然后在配置一下,微信小程序的 AppId,直接去之前的项目中拷贝一下 ...
基于.NET、Uni-App开发支持多平台的小程序商城系统 - CoreShop
前言
小程序商城系统是当前备受追捧的开发领域,它可以为用户提供一个更加便捷、流畅、直观的购物体验,无需下载和安装,随时随地轻松使用。今天给大家推荐一个基于.NET、Uni-App开发支持多平台的小程序商城系统(该商城系统完整开源、无封装无加密、商用免费、支持二次开发、支持跨平台、支持多数据库):核心商城系统(Co ...
uni-app中使用map
uni-app中使用地图显示当前的位置
我们现在的需求是,显示用户在地图上所处的位置。
有的小伙伴可能会说,这个是不是需要接入第三方的地图。
其实是不需要的,从目前这个需求来看。
我们只需要引入uni-app提供的内置组件 map 。
然后设置经纬度以及缩放大小就行
下面我们就来简单的演示一下
使用 map 组件显示某一个位置
...
Uni-App Http请求
该插件适用于一般的请求场景,
只支持post、get、put和delete请求,目前不适用于其他的请求形式,比如上传,下载等。插件定位为 小而美,而不是大而全,目标是切合实际,开箱即用。
平台差异说明
AppH5微信小程序支付宝小程序百度小程序头条小程序QQ小程序
√
√
√
√
√
√
√
由于某些小程序平台的限制:
delet ...
vue2生命周期、vue3生命周期、uni-app生命周期
一、生命周期
Vue 实例有一个完整的生命周期。
也就是从开始创建、初始化数据、编译模版、挂载 Dom -> 渲 染、更新 -> 渲染、卸载等一系列过程,我们称这是 Vue 的生命周期
二、vue2生命周期(钩子函数)
(1)钩子函数:
在特定阶段或特定事件发生时被执行的函数
在钩子函数中可以编写逻辑
【初始化操作、发送请求、处理 ...
基于uni-app+vue3渲染markdown格式|uniapp软键盘顶起问题解决方案
前些时候有给大家分享一篇uni-app+vite4+uview-plus搭建跨端项目。今天主要分享下在uniapp中渲染markdown语法及uniapp中软键盘弹起,页面tabbar或顶部自定义navbar导航栏被撑起挤压的问题。
如上图:支持h5+小程序+App端markdown解析渲染。
上面则是演示了在App端+小程序端键盘弹起,整体页面及自定义导航条不会被顶跑 ...