前端知识框架 前端知识框架
首页
基础
框架
插件
Node
地图
更多
前端须知
  • 分类
  • 标签
  • 归档

BestIdea

首页
基础
框架
插件
Node
地图
更多
前端须知
  • 分类
  • 标签
  • 归档
  • SVG图标组件
  • vue性能
  • vue中使用less全局变量
  • 路由懒加载
  • 生命周期
  • 双向绑定原理
  • 微信网页开发
  • 微信小程序开发(uni-app)
    • 开发
      • 生命周期
      • 路由配置
      • 页面布局
      • 网络请求
      • 文件上传
      • 分包配置(一般用不到)
  • 微信小程序开发
  • 微信小程序入门
  • 0与3.0项目对比
  • 预渲染
  • 组件通信方式
  • Vue3.x组合式编程
  • 从零搭建 vite+vue3+ts+pinia 框架
  • Vue-iClient3D-WebGL入门文档
  • Vite常用配置
  • 框架
Btzh
2022-03-26
目录

微信小程序开发(uni-app)

# 准备

  1. 申请账号 https://developers.weixin.qq.com/miniprogram/dev/framework/quickstart/getstart.html#%E7%94%B3%E8%AF%B7%E5%B8%90%E5%8F%B7

  2. 配置服务器域名 (后端需要的 appid 和 appsecret) 1

注意:其中业务域名是 小程序中使用 <web-view>才需要配置的域名

  1. 配置小程序成员管理 (体验成员可以使用体验版的小程序) 1

  2. 开发者下载开发工具 (开发者工具使用前,需要在后台 [ 成员管理 -> 项目成员 ] 分配开发者权限) https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

  3. 版本管理 (开发者通过开发工具上传体验版,在这里可以获取体验码,分享到体验群中,就可以使用体验版小程序了) 1

# 开发

本文档是基于 uni-app (opens new window),基于 vue 语法开发,学习成本更小,而且uni-app的 api 和组件与微信小程序都是一一对应,所以开发微信小程序,只需要清楚和 H5 开发有哪些不同,就完全可以使用vue来开发微信小程序。

# 生命周期

  1. 应用的生命周期 (opens new window)(仅在 App.vue 中使用的)

  2. 页面生命周期 (opens new window) (与 vue 生命周期不同)

  3. 组件生命周期 (opens new window) (与 vue 生命周期相同)

# 路由配置

https://uniapp.dcloud.io/frame?id=%e8%b7%af%e7%94%b1

每个页面可以在 onLoad的生命周期的 options参数中获取路由传递的参数

# 页面布局

https://uniapp.dcloud.io/frame?id=%e9%a1%b5%e9%9d%a2%e6%a0%b7%e5%bc%8f%e4%b8%8e%e5%b8%83%e5%b1%80

# 网络请求

https://uniapp.dcloud.io/api/request/request?id=request 通过提供的request的方法,可以结合Promise自己进行重新封装

# 文件上传

https://uniapp.dcloud.io/api/request/network-file 通过提供的uploadFile的方法,可以结合Promise自己进行重新封装

# 分包配置(一般用不到)

项目实践 https://cb.btzh.net/grid-xd/grid-xd-wx-app

上次更新: 2022/05/05, 17:47:41
微信网页开发
微信小程序开发

← 微信网页开发 微信小程序开发→

最近更新
01
webpack打包替换类名命名空间
05-01
02
Vite常用配置
02-26
03
crypto前端加密
01-18
更多文章>
Theme by Vdoing | Copyright © 2022-2024
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式