自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(78)
  • 收藏
  • 关注

原创 【豆包生成】Vue 中自定义文件上传组件的实现

FileUpload},methods: {// 在这里处理文件上传,比如发送到服务器console.log('开始上传文件:', file);

2024-10-31 13:31:49 264

原创 axios 接口返回文件流保 存成文件

接口返回文件流需要对返回的数据类型进行指定,在Axios请求里传递参数 {responseType: ‘blob’},这样接口返回的数据类型就会变成 blob 格式。方便后续处理接口返回的文件数据。通过响应头中是否存在 Content-Disposition 判断返回的数据是不是文件流。如果不是文件流就当成普通接口处理。同时在 axios 的响应拦截函数里面通过 responseType === ’blob‘ 判断是否返回响应头的数据。通过 FileReader() 转化 blob 为对象格式。

2024-10-31 11:19:35 154

原创 vue $nextTick 实现原理

nextTick实现原理

2024-10-16 16:05:41 1089 1

原创 算法:爬楼梯

到达第 i 阶楼梯的方法数是到达第 i-1 阶和第 i-2 阶楼梯的方法数之和。这是因为,要到达第 i 阶,你最后一步要么是从第 i-1 阶上来的,要么是从第 i-2 阶上来的。

2024-08-27 14:12:43 375

原创 uniapp 中 web-view 向 App 传递消息

在web项目中引入官方库 uni.webview.1.5.4.js ,

2024-08-14 14:17:40 712

原创 通过iframe碎片实现web局部打印

iframe碎片实现web界面局部打印。解决了拉起打印机内容为空;解决了拉起打印机样式丢失;

2024-07-25 17:09:18 330

原创 浏览器跨标签页通信

现代Web开发中的跨标签页通信是一个多样化且复杂的话题。通过结合LocalStorage、Broadcast Channel API、SharedWorker、postMessage以及Cookie,开发者可以选择适合自己应用场景的最佳方案。理解这些技术的优势和局限性对于设计一个高效、安全且用户友好的Web应用至关重要。

2024-04-23 14:21:59 832

原创 解决input事件监听拼音输入法导致高频事件

compositionstart 事件触发于一段文字的输入之前(类似于 keydown 事件,但是该事件仅在若干可见字符的输入之前,而这些可见字符的输入可能需要一连串的键盘操作、语音识别或者点击输入法的备选词)。触发compositionstart时,文本框会填入 “虚拟文本”(待确认文本),同时触发input事件;在文本框中输入内容,执行查询接口,但遇到一个问题,当用拼音打字写汉字去搜索的时候,会输入一些字母拼成汉字,怎么能监听等拼音文字输入完成后再触发文本框监听事件。

2024-03-11 22:58:44 675

原创 Flutter中系统Emoji通过substring裁切后无法识别导致渲染错误

所以就出现了,某下情况下使用substring裁切带emoji的字符串的时候,就会出现渲染错误的问题。tip:在 Flutter 输入框中以苹果的数字图标 1 2 3 4 5 6 7 8 9 0 为开头的内容,输入到输入框中就会导致后续的所有字符都无法识别。一个emoji 的长度是2 或者 3,那么我们 substring 的时候,就会特殊情况下把emoji裁切了一半的情况。这样就会导致显示错误。遇到渲染错误的情况我第一时间想到的是这个emoji识别不出来,导致的显示出错。想要了解的可以看这个。

2023-09-06 10:35:31 716

原创 Flutter Widget之CompositedTransformTarget+CompositedTransformFollower(例如:功能引导指示,跟随弹窗等功能。)

在合成阶段(在绘制阶段之后,如 WidgetsBinding.drawFrame 中所述)合成此小部件时,它会应用一个转换,将链接的 CompositedTransformTarget 的 targetAnchor 和此小部件的 followerAnchor 结合在一起。如果父级覆盖屏幕,这很容易实现,所以这个小部件通常用作应用程序范围的 Overlay 中的 OverlayEntry 的根(例如,由 MaterialApp 小部件的导航器创建)。例如:功能引导,跟随弹窗等功能。

2023-08-02 14:29:50 517

原创 Flutter 中实现截图指定控件并进行微信分享和本地存储

我们拿到控件生成的 ByteData,通过 ByteData.buffer.asUint8List() 拿到 Uint8List ,然后通过 RenderRepaintBoundary 中的 toImage() API 来获取当前控件生成的 ByteData。上面我们已经拿到了,生成 png 文件了,下面的就直接根据 fluwx 的文档直接去用就可以了。之后获取临时的缓存目录,File().create() 创建 一个空间的 png File。想要仔细了解 image_gallery_saver 点。

2023-07-27 14:37:59 1022

原创 微信开放标签 wx-open-launch-app 拉起 Flutter APP 白屏。

但是在 Flutter 项目中使用微信开放标签拉起 APP 会跳转进一个 native 白屏界面,只有你返回的时候才会返回到 flutter 的 页面,这就非常的奇奇怪怪。大家应该都知道在微信浏览器里面是无法直接拉起 APP 的,需要对接微信的开放标签 (wx-open-launch-app) 拉起 APP。我把这个example 的配置全部拿到新建的空白项目中后,就不会在跳到 native 的白屏界面。一开始怀疑是项目代码有问题,倒是我哪怕是新建一个空白的项目去拉起还是白屏,这就比较难搞了。

2023-05-05 10:29:41 603

原创 Flutter实现文本尾部添加跟随图标

Flutter实现文本尾部添加跟随图标

2023-02-15 11:09:10 1284

原创 Flutter 开发一个自己的 package(纯Dart)并提交到pub.dev上

发布你的 package 之前,确保检查了这几个文件:pubspec.yaml、README.md 和 CHANGELOG.md,确保它们完整且正确,另外,为了提高 package 的可用性,可以考虑加入如下的内容:

2023-01-12 15:48:21 1424

原创 手写极简VUE(MVVM) 实现 v-click 和 v-model

手写极简MVVM实现了 {{}} 模板数据解析v-click事件c-mode指令

2022-12-07 20:09:48 1398

原创 如何优雅的在Column中嵌入横向滚动的 ListView

如何优雅的在Column中嵌入横向滚动的 ListView

2022-10-27 10:48:14 854

转载 provider: ^6.0.4(来自于文档)

对 InheritedWidget 组件的上层封装,使其更易用,更易复用。使用 provider 而非手动书写 InheritedWidget,有以下的优势:简化的资源分配与处置懒加载创建新类时减少大量的模板代码支持 DevTools更通用的调用 InheritedWidget 的方式(参考 Provider.of/Consumer/Selector)提升类的可扩展性,整体的监听架构时间复杂度以指数级增长(如 ChangeNotifier, 其复杂度为 O(N))

2022-10-24 11:20:49 215

原创 vite + react + ts 配置路径别名alias

path 模块是 node.js 的内置模块,而 node.js 默认不支持 ts 文件的,所以需要安装 @type/node 依赖包。的时候才不会提示是否安装你。根据需要进行配置路径别名。

2022-09-05 17:37:19 1876

原创 React -- Poratal CssModule Fragment 字体库 Context Class.ContextType UseEffect

React -- Poratal CssModule Fragment 字体库 Context Class.ContextType UseEffect

2022-09-01 17:27:38 330

原创 el-tabale 多选添加 分页 默认选中

el-tabale 多选添加 分页 默认选中1. 子组件 `initData` 初始化获取数据之后 通过 `this.$nexttick(()=>{})` 对 `el-table` 进行默认选中。当前选中的项 包括三部分 :2. 需要吧这三项进行合并去重,存储到 `currentSelect` . 然后根据 `el-table` 当前页的数据 过滤后 默认选中。默认选中会刷新 `selectionGoodsList` 为当前页面选中的数据。3. 确认选中的时候 就更新所有的选中项 `currentSe

2022-08-10 15:21:29 1620

原创 ES13 - ES2022 - 第 123 届 ECMA 大会批准了 ECMAScript 2022 语言规范

2022 年 6 月 22 日,第 123 届 ECMA 大会批准了 ECMAScript 2022 语言规范,这意味着它现在正式成为标准。

2022-08-08 14:00:09 199

原创 公众号测试号 进行H5授权获取code《前端部分》

Vue-H5 微信公众号静默授权。从注册测试号到进行授权。目前仅支持微信浏览器内部进行授权,还没有在其他浏览器进行授权的逻辑。公众号授权进行开发调试的时候需要微信浏览器访问访问电脑端开启的项目服务,之后会讲手机怎么访问电脑开启的项目服务。...

2022-07-08 10:34:47 2853 1

原创 Flutter

实现如截图所示的 多选功能实现代码:实现 多选中的 每一项的代码:import 'dart:core';import 'package:flutter_screenutil/flutter_screenutil.dart';import 'package:flutter/material.dart';/// @author XCC/// @创建时间:2022/5/9/// 工具菜单checkbox版子项class ToolMenuCheckboxItemWidget ..

2022-05-09 22:36:14 382

原创 element中select,值更新视图不更新

一、 业务逻辑使用el-table的自定义列功能,同一行数据的两列有互动,当一列(值来源)数据改变,另一列(默认值)的el-select无法选中值(实际v-model对应的数据已改变,但是页面上没有更新),如图:二、原因默认值这一列对应的select的v-model对应的字段是在table生成后动态插入的,初始的数据结构类似://data 为el-table的datavar data=[ {src:'param'}]src字段改变后,在值来源的select的chan..

2022-03-13 11:53:24 3898

转载 初学three.js

初学three.js开始之前的准备工作创建一个场景渲染场景是立方体动起来结果开始之前的准备工作在html文件中通过cdn导入threejs的包,之后你就可以在获取到threejs的全局变量THREE创建一个场景为了真正能够让我们的场景借助threejs来进行显示,我们需要先初始化几个对象:场景、相机和渲染器,这样我们就可以通过摄像机看到我们渲染出的场景了let scene = new THREE.Scene();let camera = new THREE.PerspectiveCamera(7

2022-03-08 16:24:53 1185

原创 HTTP缓存机制

web缓存:数据库缓存,服务器缓存,浏览器缓存;浏览器缓存:indexDB localStorage(5M);sessiStorage(5M);Cookie(4K) HTTP缓存HTTP缓存:强缓存(expries Cache-Contral) 协商缓存(Etag:if-none-match Last-Modifiy:if-Modify-Since)浏览器第一次请求浏览器再次请求:为什么已经有了Last-Modifiy 还需要ETag ?1. Last-Modified.

2022-01-25 15:12:45 642

原创 VUE插件 --(来自官方文档)

插件插件是自包含的代码,通常向 Vue 添加全局级功能。它可以是公开install()方法的object( { install:xxxx } ),也可以是function1、编写插件每当这个 插件 被添加到应用程序中时,如果它是一个对象,就会调用对象中的install方法。如果它是一个function,则函数本身将被调用。两种情况调用的函数都会接受两个参数:Vue.creatApp生成的对象和自己填写的options;差劲最好单独在一个文件中编写 暴...

2022-01-15 14:43:40 943

原创 web局部打印

vue项目对部分DOM进行打印通过$ref 获取需要打印的DOM注册自定义全局方法$printimport Print from '@/common/print.js' // 引入附件的js文件Vue.use(Print) // 注册print.jsprint.js// 打印类属性、方法定义/* eslint-disable */const Print = function (dom, printType, options) { if (!(thi.

2022-01-13 11:43:14 167

原创 directive 拖拽dialog

其实没什么东西就是添加一个自定义指令,就是在dialog的头部的时候,添加一个onmousedown 事件,获取当前鼠标的位置 然后更新dialog的定位位置;copy可用: bind(el, binding, vnode) { const dialogHeaderEl = el.querySelector('.el-dialog__header') const dragDom = el.querySelector('.el-dialog') dialogHeade.

2022-01-06 16:11:34 164

原创 directive 自定义指令

设置自定义指令实现 一些通用的功能,样式等Example :(文档上的)<div id="dynamicexample"> <h3>Scroll down inside this section ↓</h3> <p v-pin:[direction]="200">I am pinned onto the page at 200px to the left.</p></div>const app = Vue.c

2021-12-24 16:20:03 698

原创 vue3 draggable拖拽

!!首先安装 vuedraggable npm i -S vuedraggable@next一定要带上@next,不然就会报错 很恶心!使用建议看官网。官网:vue.draggable中文文档 - itxst.comVue.Draggable是一款基于Sortable.js实现的vue拖拽插件。支持移动设备、拖拽和选择文本、智能滚动,可以在不同列表间拖拽、不依赖jQuery为基础、vue 2过渡动画兼容、支持撤销操作,总之是一款非常优秀的vue拖拽组件。https://www.itxs..

2021-12-21 16:03:59 6026

原创 富文本(vue3)SQL格式化 JSON格式化

先上图看效果:SQL格式化使用的是 codemirror 和 sql-formatter 实现的(建议看文档搞)使用就直接用就可以了,如果用的地方多建议 install 全局组件 <codeEditor v-model:value="code" :scene="type" :height-size="200" ></codeEditor>对富文本编辑器进行封装。直接copy可用<templat...

2021-12-17 21:53:40 2642

原创 Upload 上传文件 设置请求参数

Upload 上传文件设置参数和请求

2021-12-14 10:41:35 4096

原创 VUE3 + TS 使用 Axios(copy可直接使用)

index.ts 用来暴露实例import EnclosureHttp from "@/utils/http/requset";const http = new EnclosureHttp();export default http;request.ts 实现 axios 创建实例 请求拦截 响应拦截 和默认 的get post 封装(偷懒了,没有封装自定义的 get post put delete )import Axios, { AxiosRequestConfig, A.

2021-12-04 21:52:01 10039

原创 TS 小记 和 Record

Record<K,T>;将petsGroup中的每个值(‘dog’ | ‘cat’ | ‘fish’)都转为 IPetInfo 类型。当然也可以自己在第一个参数后追加额外的值,type petsGroup = 'dog' | 'cat' | 'fish';interface IPetInfo { name:string, age:number,}type IPets = Record<petsGroup, IPetInfo>;const anim...

2021-11-29 22:41:27 1309

原创 vue-cli4 打包配置 部署到github

一、配置打包根目录下添加vue.config.js 自定义相关配置,文件位置名字什么的根据自己喜欢配置,构建大型项目的时候可能需要,自己写着玩的就随便啦,不配置也没有问题。最主要的还是参考官方文档!(官方文档永远的神!!!)配置参考 | Vue CLI????️ Vue.js 开发的标准工具https://cli.vuejs.org/zh/config/// vue.config.jslet version = "";(function () { const d = ne

2021-11-27 12:04:18 390

原创 算法 :两数相加

一、比较恶心的算法逻辑:因为对链表不了解,所以我最开始想到的是 类似两个数组相加;把两个链表遍历成数组然后倒过来转换成数字,相加后再反转数组;比如:arr1 = [2,8,6] ;arr2= [9,5,2] 把两个数组 reverse() 之后 join() 一下不就能得到 '682' 和 '259'了吗!Number() 之后 在相加 这不就得到 707 吗! 最后就是 split() 一...

2021-11-25 12:02:57 808

原创 极简的MVVM实现

MVVM 匹配 {{}}

2021-11-21 22:31:18 497

原创 Promise 实现

// promise手写 /* 1.promise状态 pending(等待) resolve(成功) reject(失败) 2. resolve 和 reject 函数 3. then方法的实现 4.发布订阅者模式 实现异步 5.链式调用 ( 返回 普通值 和 promise) 6.resolve reject all race c...

2021-11-19 16:35:24 560

原创 node.js - 笔记 : 保存喜欢的图片

//引入核心模块const http = require("http");const https = require("https");const fs = require("fs");const cheerio = require("cheerio");for (var page = 1; page < 2; page++) {}// let url = `https://pic.netbian.com/4kdongman/index_${page}.html`for (let .

2021-10-29 16:38:02 281

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除