- 博客(160)
- 收藏
- 关注
原创 小程序中的本地存储
异步的读取,接收一个配置对象,对象里面首先有 key,表示你要读取哪一个数据,因为是异步,所以读取到的数据会传给 success 回调函数,如果读取失败,那么会触发 fail 回调函数。从 2.21.3 版本开始,往本地存储写入数据时,可以进行一个加密的操作,只需要配置 encrypt 为 true 即可。写入实际上也很简单,首先我们来看一下异步写入,使用到的是 wx.setStorage。
2025-04-03 08:47:26
637
原创 小程序中的网络请求
在小程序中,使用 wx.request( ) 这个方法来发送网路请求,整个请求的方式和 jQuery 里面的 $.ajax 方法是非常相似的。
2025-04-02 10:23:56
696
原创 微信小程序—路由
app.json 主要是对整个小程序进行一个全局的配置。当然,在 app.json 中,还可以进行更多的配置,可以参阅官方文档:https://developers.weixin.qq.com/miniprogram/dev/framework/config.html#%E5%85%A8%E5%B1%80%E9%85%8D%E7%BD%AE除了上面两项配置,有一个用的更多的就是 tabBar,在配置这个项目是,list 是必不可少的,list 对应的值为一个数组,数组里面为一个一个的对象,每个对象代表一个
2025-04-02 10:15:34
690
原创 App与Page构造器
有一点一定要注意,虽然在小程序中有多个页面,但是多个页面的 JS 跑在一个线程中,这也就意味着假设你在当前页面设置了定时器,从一个页面跳到另外一个页面,之前所设置的计时器并不会被清除掉。另外还有一点,虽然我们通过 getApp 能够获取到 App 的实例,但是一般仅仅是拿来获取 globalData,不要去主动调用生命周期钩子函数,生命周期钩子函数应当是在对应的时间点主动触发的。在进行页面跳转的时候,往往存在一种情况,就是当前页面需要传递一个 id 给新的页面,新的页面就根据当前这个 id 显示详情信息。
2025-04-02 10:09:01
832
原创 用户交互核心—事件
在上面的示例中,因为 inner 是使用 bind 来绑定的,所以会向上冒泡,触发 middle 的 tap 事件,但是 middle 绑定 tap 事件的时候,使用的是 catch 来绑定,catch 会阻止冒泡。longtap 和 longpress 的区别在于,如果同时还绑定了 tap 事件,那么longpress并不会再次触发tap事件,而longtap则会再次触发tap事件。在上面的代码中,如果我们针对 inner 进行点击,那么,事件会一直向上冒泡,outter 组件的 tap 事件也会触发。
2025-04-02 09:42:12
375
原创 小程序的外观—WXSS
以前在开发 WebApp 的时候,我们通过 JS 获取到屏幕的尺寸信息,然后手动去计算应该如何进行缩放。但是和原生 CSS 有一个区别在于,WXSS 会把 @import 引用的 CSS 打包到一块儿。app.wxsss 位于项目的根目录下面,是整个项目的公共样式,它会被注入到小程序的每个页面。为了适配不同分辨率的屏幕,小程序引入了新的单位:rpx。同一个元素,在不同宽度的屏幕下,如果使用px为尺寸单位,有可能造成页面留白过多。基本上和 CSS 也是相同的,使用 @import 来进行引用。
2025-04-02 09:10:29
446
原创 小程序的骨架—WXML
定义模板通过 template,使用 name 来设置模板的名称,模板中可以使用猫须语法接收动态的数据<view></view>引入模板的时候,可以使用 import 和 include例如下面是使用 import 来引入模板在使用的时候通过 is 属性来指定模板的名称,并且通过 data 属性来传入模板所需要的数据<template is="msgItem" data="{{index : 1, msg: '你好', time:'2023.1.10'}}"></template>
2025-04-02 09:05:52
508
原创 小程序的准备工作
进入之后,在【开发】-【开发管理】-【开发设置】下面能够找到自己的 AppID,这个 ID 非常重要,每次我们创建项目的时候,都需要填写这个 ID。接下来是安装“微信开发者工具”,前往官网提供的地址,选择操作系统对应的版本,下载安装即可。首先需要申请一个账号,注意注册的邮箱不要是之前用过的,最好专门拿一个新的邮箱来进行申请。申请完账号之后,有一个非常重要的东西,叫做 AppID。
2025-04-02 08:54:36
225
原创 ES6 字符串和正则表达式
后来,由于技术的发展,Unicode对文字编码进行了扩展,将某些文字扩展到了32位(占用两个码元),并且,将某个文字对应的二进制数字叫做码点(Code Point)。早期,由于存储空间宝贵,Unicode使用16位二进制来存储文字。我们将一个16位的二进制编码叫做一个码元(Code Unit)。ES6为了解决这个困扰,为字符串提供了方法:codePointAt,根据字符串码元的位置得到其码点。同时,ES6为正则表达式添加了一个flag: u,如果添加了该配置,则匹配时,使用码点匹配。
2025-03-11 22:35:23
297
原创 var与let 块级绑定
底层实现上,let声明的变量实际上也会有提升,但是,提升后会将其放入到“暂时性死区”,如果访问的变量位于暂时性死区,则会报错:“Cannot access ‘a’ before initialization”。在循环中,用let声明的循环变量,会特殊处理,每次进入循环体,都会开启一个新的作用域,并且将循环变量绑定到该作用域(每次循环,使用的是一个全新的循环变量)块级作用域:代码执行时遇到花括号,会创建一个块级作用域,花括号结束,销毁块级作用域。在循环中使用let声明的循环变量,在循环结束后会销毁。
2025-03-09 23:36:28
366
原创 ES6 课程概述
ECMAScript:简称 ES,是一个语言标准(循环、判断、变量、数组等数据类型)JavaScript:运行在浏览器端的语言,该语言使用 ES 标准。NodeJs:运行在服务器端的语言,该语言使用 ES 标准。无论 JavaScript,还是 NodeJs,它们都是 ES 的超集(super set)ES6.0: 2015, 从该版本开始,不再使用数字作为编号,而使用年份ES6 解决 JS 无法开发大型应用的语言层面的问题。之后的课程会介绍如何解决难度和《JavaScript 基础》差不多。
2025-03-09 23:10:58
402
原创 vue组件事件
抛出事件:子组件在某个时候发生了一件事,但自身无法处理,于是通过事件的方式通知父组件处理。注册事件:父组件申明,当子组件发生某件事的时候,自身将做出一些处理。事件参数:子组件抛出事件时,传递给父组件的数据。
2025-02-07 14:22:38
208
原创 VUE搭建工程
单文件组件,Single File Component,即一个文件就包含了一个组件所需的全部代码。时,会直接把组件中的模板转换为。是一个脚手架工具,用于搭建。除了基本的插件和加载器外,),以达到开箱即用的效果。函数,这叫做模板预编译。,并预置了诸多插件(/* 组件样式 */
2025-02-07 14:01:15
337
原创 vue组件
绝大部分情况下,一个组件就是页面中某个区域,组件包含该区域的:功能(JS代码)内容(模板代码)样式(CSS代码)要在组件中包含样式,需要构建工具的支撑。
2025-02-07 13:51:51
478
转载 vue ssr 是什么意思
Vue SSR 是一种强大的技术,能够提升页面的首屏加载速度和 SEO 性能,特别适用于内容丰富、需要搜索引擎优化的网站。然而,其实现较为复杂,需要考虑服务器负载和开发环境的差异。为了充分利用 Vue SSR 的优势,建议在实际项目中结合缓存、代码分割和异步数据处理等最佳实践。通过合理的设计与优化,可以显著提升用户体验和搜索引擎友好度。转载出处:https://worktile.com/kb/p/3593189。
2025-01-08 09:23:55
68
原创 bootstrap
媒体类型all 所有设备print 打印机设备screen 彩色的电脑屏幕speech 听觉设备(针对有视力障碍的人士,可以把页面的内容以语音的方式呈现的设备)注意:tty、tv、projection、handheld、braille、embossed、aural 等几种类型在媒体查询 4 中已经废弃。
2024-12-31 17:24:26
1955
原创 弹性盒子(display: flex)布局超全讲解|Flex 布局教程
弹性布局(Flex 布局)是一种现代的 CSS 布局方式,通过使用 display: flex 属性来创建一个弹性容器,并在其中使用灵活的盒子模型来进行元素的排列和定位。
2024-12-26 21:18:11
3111
原创 uni-app收藏按钮组件实现⑬
获取用户记录值找到指定字段 article_likes_ids通过 db.command 更新指令修改 article_likes_ids参考地址:https://uniapp.dcloud.io/uniCloud/cf-database?当文章 id 存在,进行删除操作,使用 pull 方法 参考地址:https://uniapp.dcloud.io/uniCloud/cf-database?id=pull。
2024-11-11 18:01:45
1026
原创 uni-app用户登录⑫
定义发送函数,将用户信息以及本次请求的用户登录类型传递给后端。通过 form 进行手机号码单独验证,并获取手机号码。保证 send-code 获取 form 对象。main.js 中进行 store 注册。获取用户信息之后,进行用户信息保存操作。创建请求方法 user_login。定义 user_login 函数。前端接收返回信息,进行数据处理。启动定时器,调整文本显示内容。
2024-11-11 18:00:12
822
原创 uni-app上拉加载更多⑩
监听 scroll-view 的 scrolltolower 事件,触底时进行新的数据请求,当前的 page 值。下载地址:https://ext.dcloud.net.cn/plugin?创建每一个分类的存储对象,含 page 及加载状态。前端添加 page 及 size 属性到云函数。前端调整数据处理将直接赋值变为追加数据。云函数内进行返回值限制处理。处理数据全部加载完成状态。
2024-11-11 17:54:26
1295
原创 uni-app文章列表制作⑨
创建基本样式及结构定义多状态卡片模块通过父组件传递 mode 属性进行条件编译根据条件进行选项卡卡片展示根目录下创建 index.html 文件参考地址:https://uniapp.dcloud.io/collocation/manifest?manifest 文件的 html5 配置中进行 index.html 文件引入。
2024-11-11 17:52:07
826
原创 uni-app文章列表制作⑧
使用 swiper 组件实现滚动效果swiperItem 数量动态话,当前的 swiper 数量应该与选项卡的数量相同获取选项卡的数量值,根据选项卡数量进行 swiperItem 渲染,index 界面进行 labelList 传递ArticleList 内根据 swiper 数量进行 swiperItem 渲染选项卡与 swiper 组件联动效果实现选项卡点击事件绑定发送事件,调整 activeIndex 值,将 activeIdnex 值调整为父组件传递值。
2024-11-11 17:48:16
430
原创 uni-app请求方法封装⑦
创建 http.js 文件,导出一个封装好的 promise 对象(内部进行 uniCloud 调用)//name云函数的名字 data参数据/* 导出pormise对象 *///开启loading弹窗name,//成功的状态//能够拿到数据值} else {//提示框,一般是后端没有查询到数据值},//请求失败,一般是网络的原因,后端的错误},//完成的状态//关闭loading弹窗},})})
2024-11-11 17:46:01
679
1
原创 uni-app选项卡制作 ⑥
page 下的 index 界面进行数据获取,并将数据传递到 tabBar 组件,unicloud.callFunction 方法进行数据获取。参考文档地址:https://uniapp.dcloud.io/component/scroll-view。使用 scroll-view 横向滚动的时候,需要注意,内部需添加一个容器对里面的滚动内容进行包裹。tabBar 组件内部 prop 属性进行数据获取。定义云函数,获取 label 表中的数据。3.this 指向问题。点击选项卡实现高亮效果。
2024-11-11 17:40:11
772
原创 uni-app 导航栏制作适配多端⑤
文档参考地址:https://uniapp.dcloud.io/api/ui/menuButton?方法参考地址:https://uniapp.dcloud.io/api/system/info?同名组件支持 easycomment,不需要使用 import 方式进行导入即可使用。对组件名命方便我们的 devtools 进行内容查找。处理小程序显示错位问题。
2024-11-11 17:38:04
196
原创 uni-app项目启动-结构搭建④
uni.scss 文件定义公共变量及混编方法每个页面下直接进行样式方法及变量使用/* 多行注释 */) {/* 全局系统样式定义 */创建 tabBar 需要的页面文件index 页面follow 页面self 页面。
2024-11-11 17:33:53
1457
原创 uni-app中使用 unicloud 云开发平台③
uniCloud是 DCloud 联合阿里云、腾讯云,为开发者提供的基于 serverless 模式和 js 编程的实现后端服务的云开发平台。不需要服务器的购买配置即可快速创建一个完整的后端服务。
2024-11-11 17:25:58
1246
原创 jQuery 简介⑤属性操作
document.ready方法在DOM树加载完成后就会执行,而window.onload是在页面资源(比如图片和媒体资源,// 获取第一个匹配元素的innerText值(jQuery已进行兼容处理)// 设置所有匹配元素的innerHTML值为"Hello"// 设置所有匹配元素的innerText值为"Hello"它们的加载速度远慢于DOM的加载速度)加载完成之后才执行。// 获取第一个匹配元素的value值(一般用于表单控。// 设置所有匹配元素的value值为"Hello"
2024-09-24 15:01:23
313
原创 Array.prototype.slice.call()
这行代码在JavaScript中经常被用来将类数组对象(如函数的arguments对象)转换成一个真正的数组。这里解释一下为什么需要这样做以及这行代码是如何工作的。
2024-09-23 16:20:48
650
原创 jQuery 简介④ 参数规则与链式编程风格
:CSS选择器:jquery特有的选择器$(function(){}) $(document).ready()jQuery 选择器: http://www.w3school.com.cn/jquery/jquery_ref_selectors.asp这种链式编程风格的实现机制,就是jQuery对象的所有实例方法,在没有特殊的返回需求的情况下,一般都会返回该jQuery对象本身(或者其它jQuery对象),因此我们可以继续调用返回的jQuery对象上的方法。等方法在没有传入值参数时,它们将返回指定DOM
2024-09-19 15:45:40
496
原创 jQuery 简介 ③ ready()事件函数、jQuery 二个原则及容错机制
如果我们在中引入jQuery库文件,并编写相应的jQuery代码来操作DOM元素。这很可能导致操作无法成功,因为此时内的元素可能还没有加载出来,也就获取不到对应的元素。因此,我们一般会将自己的jQuery代码写在中。ready()函数的作用相当于,它用于在当前文档加载准备就绪后执行对应的函数。// $( function ) 是 $(document).ready( function ) 的简写形式。
2024-09-19 15:34:44
737
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人