微信小程序15天

devtools/2024/10/11 3:19:58/

UniApp(Vue3组合式API)和小程序>微信小程序15天学习计划

第1天:开发环境配置和基础知识

  • UniApp和小程序>微信小程序概述及对比
  • 安装并配置HBuilderX(UniApp)和微信开发者工具
  • 创建第一个UniApp Vue3项目和小程序>微信小程序项目
  • 了解两个平台的项目结构差异
  • 配置外部浏览器和各种小程序模拟器(UniApp)

第2天:页面结构和基础组件

  • 学习UniApp的.vue文件结构(template, script, style)
  • 了解小程序>微信小程序的.wxml, .wxss, .js, .json文件
  • 掌握共同的基础组件:view,text,image,button,input
  • 学习scroll-view和swiper组件的使用
  • 实现一个简单的页面布局,对比两个平台的写法

第3天:数据绑定和更新

  • UniApp: 学习ref定义响应式数据
  • 小程序>微信小程序: 了解Page中的data和setData
  • 掌握v-bind(UniApp)和{{}}(小程序>微信小程序)的使用
  • 学习class和style的动态绑定
  • 完成一个数据展示和更新的小案例

第4天:条件渲染和列表渲染

  • UniApp: v-if, v-else, v-else-if, v-show
  • 小程序>微信小程序: wx:if, wx:elif, wx:else
  • UniApp: v-for和:key
  • 小程序>微信小程序: wx:for和wx:key
  • 完成一个包含条件和列表渲染的购物车案例

第5天:事件处理和表单

  • UniApp: @click, @tap等事件处理
  • 小程序>微信小程序: bindtap, catchtap等事件处理
  • 学习表单元素的使用和事件(focus, blur等)
  • UniApp: v-model双向绑定
  • 小程序>微信小程序: 实现类似双向绑定的效果
  • 完成一个表单提交的案例

第6天:计算属性和侦听器

  • UniApp: computed计算属性
  • UniApp: watch和watchEffect
  • 小程序>微信小程序: 使用函数模拟计算属性
  • 小程序>微信小程序: 使用observers实现侦听效果
  • 完成一个使用计算属性的商品统计案例

第7天:生命周期

  • UniApp页面生命周期: onLoad, onShow, onReady等
  • 小程序>微信小程序页面生命周期对比
  • UniApp组件生命周期
  • 小程序>微信小程序组件生命周期
  • 创建一个页面,观察并记录不同生命周期的触发顺序

第8天:组件化开发(上)

第9天:组件化开发(下)

  • UniApp: emit触发事件
  • 小程序>微信小程序: 触发自定义事件
  • UniApp: defineExpose暴露方法
  • 小程序>微信小程序: 通过selectComponent调用组件方法
  • 父子组件通信案例实现

第10天:路由与页面跳转

  • UniApp: uni.navigateTo等API
  • 小程序>微信小程序: wx.navigateTo等API
  • 页面传参和参数接收
  • tabBar配置和切换
  • 实现一个多页面切换的应用框架

第11天:网络请求与数据缓存

  • UniApp: uni.request发送网络请求
  • 小程序>微信小程序: wx.request发送请求
  • Promise化网络请求封装
  • UniApp和小程序>微信小程序的数据缓存方法
  • 实现一个带缓存的数据列表页面

第12天:UI组件库使用

  • UniApp: uni-ui组件库介绍和使用
  • 小程序>微信小程序: WeUI组件库介绍和使用
  • 学习日期选择、轮播图、弹出层等复杂组件
  • 使用组件库快速搭建一个页面

第13天:条件编译与跨平台

  • UniApp条件编译的使用方法
  • 跨平台兼容性处理
  • 在UniApp中编写小程序>微信小程序特有功能
  • 抽离共用代码,提高跨平台效率
  • 修改之前的案例,使其能同时适配UniApp和小程序>微信小程序

第14天:性能优化与调试技巧

  • UniApp性能优化技巧
  • 小程序>微信小程序性能优化技巧
  • HBuilderX调试技巧
  • 微信开发者工具调试技巧
  • 分析并优化之前开发的案例

第15天:项目实战与发布


http://www.ppmy.cn/devtools/123952.html

相关文章

攻防世界(CTF)~Reverse-easyRE1

题目介绍 下载附件后一个32位一个64位 64位的放到ExeinfoPE查看一下有无壳子(无壳) 放IDA看一下伪代码,习惯性看一下main函数,直接发现了flag flag{db2f62a36a018bce28e46d976e3f9864}

Springboo通过http请求下载文件到服务器

这个方法将直接处理从URL下载数据并将其保存到文件的整个过程。下面是一个这样的方法示例: import java.io.FileOutputStream; import java.io.IOException; import java.io.InputStream; import java.io.OutputStream; import java.net.HttpURLConnection…

Python知识点:如何使用Raspberry Pi与Python进行边缘计算

开篇,先说一个好消息,截止到2025年1月1日前,翻到文末找到我,赠送定制版的开题报告和任务书,先到先得!过期不候! 如何使用Raspberry Pi与Python进行边缘计算 Raspberry Pi是一款广受欢迎的小型单…

代码随想录算法训练营第四十六天 | 647. 回文子串,516.最长回文子序列

四十六天打卡,今天用动态规划解决回文问题,回文问题需要用二维dp解决 647.回文子串 题目链接 解题思路 没做出来,布尔类型的dp[i][j]:表示区间范围[i,j] (注意是左闭右闭)的子串是否是回文子串&#xff0…

TikTok点赞被取消的原因分析与解决办法

随着TikTok的快速发展,越来越多的人和品牌将其视为推广和营销的重要平台。然而,用户在使用过程中,可能会遇到点赞被取消的情况,这不仅影响用户的使用体验,还可能对内容创作者的影响力和品牌形象产生负面影响。本文将深…

AAA Redis的过期删除策略+缓存雪崩+缓存一致性问题

目录 一、三种删除策略比较 二、缓存雪崩缓存击穿缓存穿透 三、缓存一致性 Redis学习笔记 一、三种删除策略比较 内存占用CPU占用特征定时删除节约内存,无占用不分时段占用CPU资源,频度高时间换空间惰性删除内存占用严重延时执行,CPU利用…

electron-vite_1搭建项目

脚手架选型,electron-vite;Electron开发构建工具基于Vite的;目前项目是使用Vite写的所以用这个集成比较快;目前他们也有提供vue和react的模板; 基于 Vite,快速、简单且功能强大 框架连接 electron-vite 目…

Leetcode—763. 划分字母区间【中等】

2024每日刷题&#xff08;175&#xff09; Leetcode—763. 划分字母区间 C实现代码 class Solution { public:vector<int> partitionLabels(string s) {int rightmost[26];int l 0;int r 0;for(int i 0; i < s.length(); i) {rightmost[s[i] - a] i;}vector<…