- 博客(48)
- 收藏
- 关注
RSS订阅原创 开发中小程序遇到的问题总结
搜索到的文章——如何实现快速生成朋友圈海报分享图Painter 一款轻量级的小程序海报生成组件Painter——github 地址。
2024-02-04 11:39:59
953
原创 小程序的使用
引入模板结构:引入模板样式: @Import ‘模板样式路径’开发工具中在指定的文件夹下右键新建组件a)建议：文件夹名称与组件名称最好一致。组件对应的json文件中设置: component: true"navigationStyle": "custom" -----> 自定义导航 导航栏样式"navigationBarTitleText": "登录" -----> 自定义文字生命周期回调中onShareAppMessage回调中return 对象设置自定义内容。
2023-09-08 21:45:13
838
1
原创 移动端的概念
实现理想视口以后，虽然没有滚动条和页面压缩现象了，但是移动端设备的型号很多，屏幕大小不一致，那么不同移动端设备下，页面内的元素大小如何显示？前端工程师代码明明写的是1px的border，UI工程师为什么说边框比1个像素粗呢。UI设计师: 你的效果不对，我要的是1个像素，你设计的边框错粗，大于1个像素。UI设计师：我需要你将这个box的div的边框设置成1个像素，颜色为红色。演唱会上组成大的LED*屏幕上的一块一块的小屏幕，由小的发光晶体管组成。屏幕大小是指屏幕的对角线长度，单位一般是英寸(inch)。
2023-08-31 13:16:36
1307
原创 vue3.0组件通信
自定义事件用于父子组件间的通信,子给父传参两个角度分析元素绑定绑定原生事件 – 关注 事件类型(系统内置事件) 和 触发机制(浏览器触发)绑定自定义事件 – 无意义，没有触发机制组件绑定绑定原生事件v2中所有绑定在组件标签上的原生事件都会被理解成自定义事件,需要使用.native才能转成原生事件v3中所有绑定在组件标签上的原生事件会自动绑定到子组件的根标签上转变为原生事件, .native被移除了v3注意两个:没有根标签,原生事件将变成自定义事件。
2023-08-15 20:26:41
839
原创 vue3.0
封装获取鼠标实时位置// 需求:将获取鼠标实时位置的功能封装成一个hook函数// 这里单独的功能封装到一个hook函数中,把需要的结果return出去// 在需要使用这个功能的时候引入这个函数即可// 自定义hook函数用来替代之前vue2当中的mixin// 解构,解构出pageX然后给pageX起了一个别名为x// 挂载})// 销毁 - 解绑事件})return {pageX,pageY使用。
2023-08-12 08:24:01
214
原创 vue2-组件通信
实现子给父传参事件分为 原生事件 和 自定义事件一、原生事件事件类型 - click - 在原生事件中,事件类型一定是有限个数触发机制 - 浏览器触发的,触发的时候会给函数传一个事件对象event,事件对象是浏览器生成的原生事件关于$event函数不加小括号 - 默认系统触发原生事件的时候,第一个参数是 事件对象函数加小括号 - 加小括号的时候,如果需要事件对象必须使用$event(底层上是当前这个函数外部套了一层函数,套的这个函数形参是$event,我们用的就是这个形参)
2023-08-10 20:57:41
464
原创 字符串方法、数组方法、对象方法、
在前端开发中经常会遇到类数组，但是我们不能直接使用数组的方法，需要先把类数组转化为数组。本节介绍 ES6 数组的新增方法，该方法用于将类数组对象（array-like）和可遍历的对象（iterable）转换为真正的数组进行使用。在程序中判断数组是很常见的应用，但在 ES5 中没有能严格判断 JS 对象是否为数组，都会存在一定的问题，比较受广大认可的是借助 toString 来进行判断，很显然这样不是很简洁。ES6 提供了方法更加简洁地判断 JS 对象是否为数组。在 ES5 中比较通用的方法是使用。
2023-07-16 19:16:49
213
原创 Zoomlt的使用
4、画笔颜色：按住 Ctrl+r/g/b/o/y/p 可切换画笔颜色。4、按下"Esc"键、鼠标右键或"Ctrl+1"键，可退出该模式。5、画笔粗细：按住 Ctrl+上下键/鼠标滚轮 可改变画笔粗细。11、按下Ctrl + W 键可将屏幕变为白板。12、按下Ctrl + K 键可将屏幕变为黑板。10、按下Ctrl + E 键可擦除所有标注。3、按下 Esc 键或鼠标右键可退出该模式。3、只能按下"Ctrl+4"键退出该模式。2、放大模式下点击鼠标左键也可进入该模式。13、按下 Esc 键可退出该模式。
2023-07-11 18:28:40
448
原创 vue 2.0 的使用
数据代理（简单,vm目的：让程序员更加方便的读取、修改到_data中属性。。vm身上有_data里的所有属性，且有每一个属性，都有自己的。当修改vm上的属性时，该属性对应的就会调用，去修改_data中对应的属性。当读取vm上的属性时，该属性对应的就会调用，去读取_data中对应的属性。数据劫持（_data目的：为了实现响应式（什么是响应式？—— 数据变页面自动更新），有了数据劫持，就可以捕获到数据的改变，进而重新解析模板，更新界面。。_data形式。当修改_data。
2023-07-10 19:53:10
1082
原创 mpv播放器键盘快捷键
作为个人认为最好用的播放器之一的MPV播放器，其开源，体积小，支持的格式多样等等非常优秀的功能。但其中也有部分麻烦的地方，因为功能太过强大，导致不知道某些功能的快捷键是什么，这就非常需要一个可以查阅的表了。但是官方给的说明太过长了，我还是自己整理一下吧，也主要是自己常用到的快捷键。ctrl与 - 号组合 音轨和视频的调节（音轨快进一些）】或} 播放速度加快，倍速变化速度不一样。【或{ 播放速度减慢，变化速度不一样。j 切换字幕，多字幕的时候可以使用。下方向键播放进度快退1分钟。
2023-07-10 18:44:14
1923
原创 react - TS
React全家桶TypeScriptTypeScript 简称『TS』，是微软开发的一个开源的编程语言。一、TS 特点TS 主要有如下几个特点:完全兼容 JavaScript，是 JavaScript 的超集引入类型系统，可以尽早的定位错误位置, 帮助提升开发效率 let obj = {a:1,b:2....} obj = ()=>{} console.log(obj.a);先进的 JavaScript，支持 JavaScript 的最新特性TypeS
2023-07-04 21:19:45
1640
原创 react总结
一、React 入门1.1 特点高性能、声明式、组件化、单向响应的数据流、JSX扩展、灵活1.2 React初体验<head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
2023-06-29 20:45:29
732
1
原创 git、axios、模块化导出引入、promise、webpack、
git config --global user.name "你的用户名"git config --global user.email "你的邮箱"命令来查看配置信息git init仓库初始化创建index.html文件文件加入暂存区git add -A将全部文件加入暂存区git commit -m '注释'文件提交到本地仓库ls查看文件夹下的文件暂存区中的文件列表clear或ctrl + l清屏mkdir创建文件夹删除工作区中的文件git rm --cache 文件名删除暂存区中的文件。
2023-06-15 11:10:47
592
原创 插件的总结
参数名=参数值&参数名=参数值这种格式叫做请求字符串/查询字符串，是附加在请求的url的后面。使用url模块来解析url中的字符串转变为对象的形式。
2023-06-13 20:23:46
160
原创 webpack
开发模式顾名思义就是我们开发代码时使用的模式。编译代码，使浏览器能识别运行( babel , browserify )开发时我们有样式资源、字体图标、图片资源、html 资源等webpack 默认都不能处理这些资源，所以我们要加载配置来编译这些资源代码质量检查，树立代码规范类似于gulp中的jshint，在webpack中是eslint提前检查代码的一些隐患，让代码运行时能更加健壮。提前检查代码规范和格式，统一团队编码风格，让代码更优雅美观。
2023-06-12 21:06:37
534
原创 axios总结
拦截器本质上其实就是一些函数，里面有两类拦截器，一个是请求拦截器；一个是响应拦截器。请求拦截器的作用：对请求的内容以及参数做处理和检查。响应拦截器的作用：对响应的内容进行预处理。
2023-06-07 21:04:28
965
原创 Es6模块化
是将一个完整的js文件按照不同的功能拆分成每一个小的js文件，然后再将这些小的js文件合并在一起，完成最终的功能，那么这种拆分的过程被称作模块化在node中每一个js文件就被称作一个模块；模块内部代码对于外部来说都是默认不可见的，如果想要在外部使用，需要向外部暴露CommonJSES6。
2023-06-07 20:14:54
242
原创 axios
Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中，是前端中最流行的ajax请求库，vue和react官方都推荐使用axios发送ajax请求中文网：http://www.axios-js.com/zh-cn/docs/基于xhr + promise的异步ajax请求库浏览器端/node端都可以使用支持请求／响应拦截器支持请求取消请求/响应数据转换批量发送多个请求拦截器本质上其实就是一些函数，里面有两类拦截器，一个是请求拦截器；
2023-06-06 20:57:43
134
原创 JavaScript 异步之宏队列与微队列
微队列永远是先执行的，如果微队列里有宏队列，那么将这个宏队列放到宏队列中进行排队等待。结果：1 7 2 3 8 4 6 5 0。先把所有的同步执行完再看微队列里的。执行结果为：25341。
2023-06-06 20:29:13
247
原创 完整的promise
Promise一、 JS中的错误处理/** * 语法固定 try...catch try 尝试的意思 catch 捕获 * 1. try catch捕获到错误之后, 后续代码可以继续执行 * 2. catch 可以将错误信息捕获到. error 是一个对象, 有message(错误信息)和stack（错误跟踪，精准到行和列）两个属性,使用console.dir(error)打印输出查看 * 3. 抛出错误之后, 在 try 里面的后续代码不会执行 * 4.
2023-06-05 21:24:00
145
原创 Promise的使用
语法固定 try…catch try 尝试的意思 catch 捕获1. try catch捕获到错误之后, 后续代码可以继续执行2. catch 可以将错误信息捕获到. error参数是一个错误对象, 有message(错误信息)和stack（错误跟踪，精准到行和列）两个属性,使用console.dir(error)打印输出查看3. 抛出错误之后, 在 try 里面的报错的后续代码就不再执行。
2023-06-02 20:05:52
1081
原创 AJAX的使用
ajax全称为Asynchronous javascript and xml，就是异步的js和xml；目的是通过ajax可以在浏览器中向服务器发送异步请求，而最大的优势就是可以整体页面无刷新的获取数据；ajax不是新的编程语言，而是一种将现有的标准组合在一起使用的新方式（JS中的一种API + 发送的http请求）。例如：百度关键词搜索、用户名的唯一性验证、新闻的异步加载XML是一种可扩展标记语言，用来被设计传输和存储数据；
2023-05-30 21:27:40
1568
原创 webAPI的DOM和BOM总结
自定义属性内置实现(标准属性): 标签本身就支持的属性 class id value …自定义属性: 在标签身上自定义的属性DOM对象.dataset.自定义属性名DOM对象.dataset.自定义属性名 = 值DOM对象.getAttribute('属性名')DOM对象.setAttribute('属性名', 值)作用: 保存数据。
2023-05-25 12:48:51
88
原创 npm包管理、cnpm、yarn、cyarn的使用
全称：Node Package Manager，Node的包管理器，也是一个应用程序。cnpm 是淘宝对国外 npm 服务器的一个完整镜像版本，也就是淘宝 npm 镜像，网站地址yarn 是 Facebook 开源的新的包管理器，可以用来代替 npm。
2023-05-23 21:15:43
916
原创 node HTTP协议搭建服务
如果是其他类型有请求体get虽然没有请求体，但是可以将需要向服务端传递的数据表现在url地址的请求字符串中?参数名=参数值&参数名=参数值这种格式叫做请求字符串/查询字符串，是附加在请求的url的后面使用url模块来解析url中的字符串转变为对象的形式;
2023-05-23 20:19:04
198
原创 node.js的Buffer、fs模块
Node.js® 是一个基于的。官网：https://nodejs.org/zh-cn/中文网站：http://nodejs.cn/说明文档：http://nodejs.cn/api-v16/作用：解析运行 JS 代码 【不能运行DOM，BOM】操作系统资源，如内存、硬盘、网络应用场景：APP 接口服务网页聊天室动态网站, 个人博客, 论坛, 商城等后端的Web服务，例如服务器端的请求（爬虫），代理请求（跨域）前端项目打包(webpack, gulp)
2023-05-22 19:21:45
547
原创 获取鼠标位置信息、获取元素大小、获取元素位置、定时器
s = parseInt(总秒数%60);// 计算当前秒数。d = parseInt(总秒数/ 60/60 /24);m = parseInt(总秒数 /60 %60 );h = parseInt(总秒数/ 60/60 %24) // 计算小时。document.documentElement.scrollTop = 值。setInterval(function(){}, 时间间隔)setTimeOut(function(){}, 延迟时间)
2023-05-15 09:52:47
588
原创 5、BOM
window，顾名思义，窗口对象。它表示整个浏览器窗口，主要用来操作浏览器窗口。同时， window对象还是 ECMAScript 中的 Global 对象，因而所有全局变量和全局函数都是它的属性，且所有原生的构造函数及其他函数也都存在于它的命名空间下。var123;
2023-05-12 21:30:08
38
原创 4、DoM事件流 事件委托、绑定事件
DOMLO绑定事件高低版本浏览器之间不存在任何的差异事件冒泡事件捕获处理程序(事件执行的代码)dom0事件及低级浏览器的dom2事件（没有第三个参数）都是只有冒泡，以后我们用的最多的也是冒泡，捕获几乎不用，高级浏览器的dom2事件可以根据第三个参数选择是捕获还是冒泡，一般我们都不写，默认是冒泡低版本浏览器DOML0事件写法中,阻止a标签默认行为通过 return false实现, 不支持preventDefault()
2023-05-12 21:28:28
795
原创 3、DOM节点操作
DOM标签对象.childNodes[1].nodeName 输出结果为 #comment。DOM标签对象.childNodes[0].nodeName 输出结果为 #text。DOM标签对象.childNodes[1].nodeType 输出结果为8。// 1. 高版本浏览器可以正常获取,ie低版本浏览器为undefined。// 说明是低版本浏览器,如果父元素中第一个是注释节点。// 当前是低版本浏览器, lastChild。// 说明当前是高版本浏览器。// 当前是高版本浏览器。
2023-05-12 21:27:56
34
原创 2、DOM事件
onmouseleave | 鼠标离开 | DOM对象.onmouseleave = function() {} || onmousewheel | 鼠标滚轮 | DOM对象.onmousewheel = function() {} || onmousemove | 鼠标移动 | DOM对象.onmousemove = function() {} || onmouseout | 鼠标移除 | DOM对象.onmouseout = function(){} |//a) 先判断当前函数有几个参数?
2023-05-12 21:26:11
82
原创 1、DOM 获取元素
标签自定义属性,特指程序员自己给标签添加的自定义属性自定义属性两种格式H5规范要求所有自定义属性必须以data-**开始完全自己定义属性,没有任何的格式要求备注:标签本身自带的属性叫内置属性或标准属性 例如: class , id, name …自定义属性本质上也是一个键值对,用来保存数据通用方式标签设置自定义属性/标准属性// 1. 设置自定义属性 div . setAttribute('myage' , 18);
2023-05-12 21:25:35
574
转载 WebAPI---BOM
大小对比作用返回自身包括padding、边框、内容去的宽度，返回数值不带单位返回自身包括padding、内容区的宽度，不含边框，返回数值不带单位返回自身实际的宽度，不含边框，返回数值不带单位他们主要用法：1.offset系列 经常用于获得元素位置 offsetLeft offsetTop2.client经常用于获取元素大小 clientWidth clientHeight3.scroll 经常用于获取滚动距离 scrollTop scrollLeft。
2023-05-12 21:18:40
66
转载 WebAPI---DOM
element.属性获取属性值element.getAttribute(‘属性’);区别：element.属性获取的是元素本身自带的属性element.getAttribute(‘属性’);主要是获取自定义的属性h5规定自定义属性以data-开头作为属性名并且赋值< div data-index = " 1 " > 或者使用js设置< div data-index = " 1 " > 或者使用js设置。
2023-05-12 21:09:08
113
转载 JavaScript基础总结
Number数值型的范围（最大值:；三个特殊值（infinity-infinityNaNisNaN–用来判断一个变量是否为非数字的类型，返回truefalseisNaN(x)如果x为数字，则返回falseisNaN(x)如果x不为数字，则返回true。
2023-05-12 20:45:33
75
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人