- 博客(79)
- 收藏
- 关注
原创 【xr-frame】微信小程序xr-frame典型案例
在之前的工作中,我大量使用XR-Frame框架进行AR开发,并积累了一些案例和业务代码。其中包括2D图像识别、手部动作识别、Gltf模型加载、动态模型加载、模型动画等内容。小程序部分使用TypeScript编写,而XR-Frame组件部分则使用JavaScript编写。如果您正在学习XR-Frame,这些案例可能对您有参考价值。有些写的不对的地方欢迎批评指正。
2024-08-18 22:01:32
2891
1
原创 R3F(React Three Fiber)经验篇
之前一直在做ThreeJS方向,现在不做了,整理了两篇R3F(React Three Fiber)的文档,这是经验篇,如果您的业务场景需要使用R3F,可以参考一下这个文档。下面是目录,按照需求自取。
2024-02-24 22:35:22
2018
原创 Dart 语言TS开发者速通(ChatGPT)
/ 输出 14如果需要给fulfilled、rejected赋予具体的值,请使用抽象类 + 常量属性。
2024-02-21 21:10:52
1003
原创 前端初学者的Ant Design Pro V6总结(上)
/ 添加跨域请求头在locales > zh-CN / zh-CN 定义常量Model采用约定式目录结构,约定在src/models和Model即命名空间,它可以划分数据流,src/models/count.ts命名空间即count,src/pages/pageA/model.ts命名空间即pageA.model。src/models目录下不支持目录嵌套定义 model下 model 定义支持嵌套定义Model就是个自定义Hooks,它需要一个默认导出的函数。
2023-01-18 23:18:42
6106
4
原创 Bug:Warning: [antd: ***] overlay is deprecated. Please use menu instead.以及解决方案
【代码】Bug:Warning: [antd: ***] overlay is deprecated. Please use menu instead.以及解决方案。
2023-01-13 21:23:45
5598
原创 FreeRTOS教程——二值信号量(四)
目的:共享资源访问、与任务同步信号量类型:二值信号量、计数型信号量、互斥信号量、递归互斥信号量本质上是一种只包含一个项数的队列。
2023-01-04 10:31:54
298
原创 FreeRTOS教程——队列(三)
queue. h创建一个新的队列。为新的队列分配所需的存储内存,并返回一个队列处理。如果队列成功创建,并返回一个新建队列的处理。如果不能创建队列,将返回0。
2023-01-04 10:30:56
1466
原创 FreeRTOS教程——定时器(二)
软件定时器允许设置一段时间,当设置的时间到达之后就执行指定的功能函数,被定时器 调用的这个功能函数叫做定时器的回调函数。回调函数的两次执行间隔叫做定时器的定时周期, 简而言之,当定时器的定时周期到了以后就会执行回调函数。
2023-01-04 10:29:09
1558
原创 FreeRTOS教程——任务(一)
运行正在执行的任务就是处于运行状态,它占用了处理器。就绪就绪的任务是那些可以执行(没有被阻塞或暂停),但是因为其他相同或更高优先级任务正在运行造成还没有运行的任务。阻塞当一个任务等待临时事件或外部事件时它就是处于阻塞状态。例如,任务调用 vTaskDelay() ,它将被阻塞(置为阻塞状态)直到超过延时时间 – 一个临时事件。任务也可以阻塞等待队列和信号事件。阻塞状态的任务一般有一个超时时间,超时后任务将解锁。阻塞的任务不会参与调度。暂停暂停状态的任务也不参与调度。
2023-01-04 10:27:39
1614
原创 JavaScript设计模式:序、设计模式分类
序、JavaScript设计模式参考:设计模式:https://juejin.cn/post/6844904032826294286一、设计模式分类(23种设计模式)创建型单例模式 原型模式 工厂模式 抽象工厂模式 建造者模式结构型适配器模式 装饰器模式 代理模式 外观模式 桥接模式 组合模式 享元模式行为型观察者模式 迭代器模式 策略模式 模板方法模式 职责链模式 命令模式 备忘录模式状态模式 访问者模式 中介者模式 解释器模式二、设计原则单一职责原则(类功能要单一
2022-05-29 11:07:16
214
原创 JavaScript设计模式:十、适配器模式
十、适配器模式一、概述适配器模式是设计模式行为型模式中的一种模式;定义:适配器用来解决两个已有接口之间不匹配的问题,它并不需要考虑接口是如何实现,也不用考虑将来该如何修改;适配器不需要修改已有接口,就可以使他们协同工作;1. 最小案例var googleMap = { show: function(){ console.log( '开始渲染谷歌地图' ); }};var baiduMap = { display: function(){
2022-05-29 11:03:07
260
原创 JavaScript设计模式:九、单例模式
单例模式就是不用重复去构建实例,直接取之前创建过的那个保存在内存中的实例,之前看element写的ui组件loading,也是单例模式。
2022-05-29 11:01:44
364
原创 JavaScript设计模式:八、状态模式
八、状态模式一、概述一个对象有状态变化,每一个状态变化都会触发一个逻辑,我们不能总是if…else 来写,所以我们就把状态和当前对象分离开来,比如最常见都红绿灯。红灯状态下是(停下),黄灯状态是(警告),绿灯状态是(通行)。那么我们就可以把这3个状态和方法都抽离出来。提高代码复用,符合开放封闭原则class RedLamp { constructor() { this.state = '红灯'; console.log('我是红灯'); } handle() {consol
2022-05-05 10:51:37
290
原创 JavaScript设计模式:七、外观模式
七、外观模式参考:https://blog.youkuaiyun.com/weixin_37064409/article/details/79073629一、概述为一组复杂的子系统接口提供一个更高级的同意接口,通过这个接口是的对子系统接口的访问更容易, 对底层结构兼容型做同意封装来简化用户使用。1. 点击事件兼容例子点击事件的兼容性封装浏览器对点击事件存在兼容性问题,对DOM绑定onclick事件为DOM0级事件,相当与为元素绑定了一个事件方法,重复定义会覆盖。<div id="dom"
2022-05-03 15:46:38
137
原创 JavaScript设计模式:六、工厂模式
JavaScript设计模式:六、工厂模式文章目录JavaScript设计模式:六、工厂模式一、概述1. 简单工厂模式一、ES6 Class实现二、原型实现2. 复杂工厂模式1) ES5原型实现2) es6-new.target属性的正确用法new.target属性实例3)ES6实现一、概述1. 简单工厂模式一、ES6 Class实现大白话:通过不同的参数由工厂的构造函数返回不同对象。工厂模式,通过传入不同短参数达到实例化不同的对象这一目的。比如: 有一天你去餐厅想吃宫保鸡丁,然后餐厅给你实
2022-05-03 15:45:42
1018
原创 JavaScript设计模式:五、迭代器模式
JavaScript设计模式:五、迭代器模式参考文档:https://juejin.cn/post/6844904032826294286一、概述提供一种方法顺序一个聚合对象中各个元素,而又不暴露该对象的内部表示。1. 主要实现方法:Iterable,next(),hasNext(),getIterator()2. 极简实践class Iterable { constructor(conatiner) { this.list = conatiner.list; this
2022-05-03 15:45:01
522
原创 JavaScript设计模式:四、发布订阅模式
JavaScript设计模式:四、发布订阅模式文章目录JavaScript设计模式:四、发布订阅模式一、概述1. 观察者模式2. 发布订阅模式3. 观察者模式是不是发布订阅模式一、概述观察者模式: 观察者(Observer)直接订阅(Subscribe)主题(Subject),而当主题被激活的时候,会触发(Fire Event)观察者里的事件。发布订阅模式: 订阅者(Subscriber)把自己想订阅的事件注册(Subscribe)到调度中心(Topic),当发布者(Publisher)发布该事件(
2022-05-03 15:44:13
2753
2
原创 JavaScript设计模式:三、代理模式
三、代理模式文章目录三、代理模式一、虚拟代理1. 简易虚拟代理例子2. 图片占位加载例子二、缓存代理1. 缓存代理的例子——计算乘积其他代理模式参考:https://blog.youkuaiyun.com/wuyufa1994/article/details/86557788一、虚拟代理1. 简易虚拟代理例子function Flower(){};var xiaoming = { sendFlower : function(target) { var flower = new Flower(
2022-05-03 15:43:12
632
原创 JavaScript设计模式:二、策略模式
JavaScript设计模式:二、策略模式文章目录JavaScript设计模式:二、策略模式一、概念二、实现方式三、例子不使用策略模式模拟传统面向对象策略模式(原型实现)JavaScript字面量对象实现ES6类实现一、概念策略模式的定义是:定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替换。策略模式指的是定义一系列的算法,把它们一个个封装起来。将不变的部分和变化的部分隔开是每个设计模式的主题,策略模式也不例外,策略模式的目的就是将算法的使用与算法的实现分离开来。一个基于策略模式的程序
2022-05-03 15:42:19
508
原创 JavaScript设计模式:一、装饰者模式(原型链)
JavaScript设计模式:一、装饰者模式(原型链)参考:https://blog.youkuaiyun.com/userkang/article/details/104533641https://www.cnblogs.com/gaosirs/p/10756503.html装饰器模式(Decorator Pattern)允许向一个现有的对象添加新的功能,同时又不改变其结构。这种类型的设计模式属于结构型模式,它是作为现有的类的一个包装。枪击大战例子// 被装饰的玩家class Player {
2022-05-03 15:41:18
572
原创 前端面试中浏览器相关问题(三):跨域
前端面试中浏览器相关问题(三):跨域熟悉web前端开发的人都知道,浏览器在请求不同域的资源时,会受到浏览器的同源策略影响,常常请求资源不成功,这也就是我们常常提到的跨域问题。这类问题常常会拖延着项目的推进,困扰着前端开发者。今天,我们就来谈一谈前端中可能会遇到的跨域问题。1.跨域问题的由来首先我们需要了解的是,前端处于项目开发过程中最接近用户的一个区域,代码最容易被hack获取解析,也最容易受到攻击。针对这个问题,互联网早期探索者Netscape提出了一个著名的安全策略——同源策略:浏览器限制脚本中发
2022-05-03 15:39:26
822
原创 前端面试中浏览器相关问题(二):回流与重绘
二、你真的了解回流和重绘吗文章目录二、[你真的了解回流和重绘吗](https://segmentfault.com/a/1190000017329980)浏览器的渲染过程生成渲染树回流重绘何时发生回流重绘浏览器的优化机制减少回流和重绘最小化重绘和重排批量修改DOM避免触发同步布局事件对于复杂动画效果,使用绝对定位让其脱离文档流css3硬件加速(GPU加速)如何使用效果重点css3硬件加速的坑回流和重绘可以说是每一个web开发者都经常听到的两个词语,我也不例外,可是我之前一直不是很清楚这两步具体做了什么事
2022-05-03 15:33:31
329
原创 前端面试中浏览器相关问题(一):浏览器存储
前端面试中浏览器相关问题(一):浏览器存储文章目录前端面试中浏览器相关问题(一):浏览器存储基本概念CookielocalStoragesessionStorage三者的异同应用场景安全性的考虑基本概念CookieCookie 是小甜饼的意思。顾名思义,cookie 确实非常小,它的大小限制为4KB左右,是网景公司的前雇员 Lou Montulli 在1993年3月的发明。它的主要用途有保存登录信息,比如你登录某个网站市场可以看到“记住密码”,这通常就是通过在 Cookie 中存入一段辨别用户身份的
2022-05-03 15:28:19
161
原创 JavaScript原型链总结:继承(二)
二、JS继承(JS原型链二)文章目录二、JS继承(JS原型链二)一、JS实现继承的七种方式1. 原型链实现继承原型链实现继承的问题:2. 借用构造函数实现继承传递参数借用构造函数的问题3. 组合继承(构造继承+原型继承)最常用!!!4. 原型式继承优缺点5. 寄生式继承6. 寄生组合式继承(一)回顾组合式继承(二)使用Object.create 和工厂增强组合式继承(三)ES5继承最佳实践,寄生组合继承!!!(四)使用原型工厂封装寄生式组合继承7. 寄生式构造函数的语法糖class二、JS多继承(Mixi
2022-03-15 09:42:43
790
原创 JavaScript 原型链总结(一)
JS原型链(一)文章目录JS原型链(一)一、对象构造函数,原型对象,实例对象之间的关系二、原型链继承三、常用API四、面试问题一、什么是原型与原型链二、原型和原型链存在的意义是什么?补充一、in与hasOwnProperty属性检测差异二、isPrototypeOf 原型链检测三、DOM节点借用Array原型方法四、合理的构造函数声明问题:不合理的构造函数合理的做法:将共享方法绑定到prototype上如果构造函数需要定义的方法较多,可以将原型声明为一个对象五、`__proto__`1. Object.s
2022-03-15 09:41:05
1429
转载 React native uuid [Error: crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid
React native uuid [Error: crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuidInstall react-native-get-random-valuesImport it before uuid:import 'react-native-get-random-values';import { v4 as uuidv4 } from 'uuid';转载自:https://s
2022-02-21 11:47:49
2015
原创 React Navigation 基本使用
React Navigation 基本使用参考资料https://reactnavigation.org/docs/环境搭建Minimum requirementsreact-native >= 0.63.0expo >= 41 (if you use Expo)typescript >= 4.1.0 (if you use TypeScript)Installationnpm install @react-navigation/nativenpm install
2022-02-20 18:19:11
2324
转载 解决 SyntaxError: Cannot use import statement outside a module 报错问题
解决 SyntaxError: Cannot use import statement outside a module 报错问题转载自 https://www.jianshu.com/p/cd36e968cd88原因: npm运行node项目, 需要babel编译, 才能支持import等高级语法;安装babelnpm install --save babel-corenpm install --save babel-preset-env npm install babel-cli -g创
2022-01-04 23:12:35
2028
原创 九、TextInput组件
TextInput组件参考文档:https://www.react-native.cn/docs/textinput#editable案例:import React from 'react';import { View, TextInput, SafeAreaView, Alert } from 'react-native';function UselessTextInput(props) { return ( <TextInput {...props} // 将父
2021-11-06 18:36:53
160
原创 八、Slider组件
Slider组件参考文档:https://github.com/callstack/react-native-sliderInstallation & UsageTo install this module cd to your project directory and enter the following command:yarn add @react-native-community/sliderornpm install @react-native-community/s
2021-11-06 18:36:10
434
原创 七、Picker组件
Picker组件参考文档:https://github.com/react-native-picker/picker#onvaluechangeGetting started$ npm install @react-native-picker/picker --saveor$ yarn add @react-native-picker/pickeriOSCocoaPods on iOS needs this extra step:npx pod-install注意:请务必cd到i
2021-11-06 18:35:30
385
原创 六、ScrollView组件
ScrollView组件ScrollView 必须有一个确定的高度才能正常工作一般来说我们会给 ScrollView 设置flex: 1以使其自动填充父容器的空余空间,但前提条件是所有的父容器本身也设置了 flex 或者指定了高度,否则就会导致无法正常滚动,你可以使用元素查看器来查找具体哪一层高度不正确。长列表尽量用FlatList,效率会比较高。综合实例import React from 'react';import {StyleSheet, Text, View, ScrollView, S
2021-11-06 18:34:28
248
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人