hkduan的博客

原创 华为OD机22道试题

华为OD机试题（javascript解题）

原创 electron打包前端项目

打包时报下面这个错误 大概意思就是这个文件下载不下来 超时了，那么我们直接复制粘贴圈画的地址到浏览器下载下来 解压到C:\Users\Administrator\AppData\Local\electron-builder\Cache\nsis。安装成功后 执行npm run dist进行打包，由于我们package.json中将打包命令electron-builder，定义为了dist，因此我们只需执行npm run dist即可打包。4.配置好之后，dist文件里面是这样的。

原创 electron打包为iOS可执行文件

要将 Electron 项目打包为 iOS 可执行文件，需要使用 Cordova 和 Electron 的结合体，即 Cordova Electron。在项目导航器中选择项目并在“General”选项卡中将“Deployment Info”中的“Target”设为“iOS”。5. 使用以下命令行将 Electron 项目构建为 Cordova 项目的 www 目录。2. 在 Electron 项目的根目录下创建一个新的 Cordova 项目。3. 进入 Cordova 项目目录并添加 iOS 平台。

原创 chatgpt prompt提示词

通过使用一些工具，我有所成长。按照它所说的，我们找到了 setupComponent 和 createComponentInstance 函数，并没有找到 setupRenderEffect 函数，ChatGPT 的只知道 2021 年以前的知识，Vue3 代码经过了很多变动，不过没关系，这不影响太多。ChatGPT 告诉我，setupComponent 函数是在createComponentInstance函数中执行的，createComponentInstance看名字是创建组件实例，看一下详细代码。

原创 部署github page的两种情况

首先建一个仓库，名称为 你的用户名 + .github.io ，github会自动给构建这个仓库下面的内容到。域名下，”/“ 后面就是你仓库内文件的根路径，具体页面根据仓库内文件结构添加即可访问。就可以访问：https://userName.github.io/test.html。首先，建造的一个仓库，随便命名，比如”test-github-page“。一、部署 userName.github.io 命名的仓库。如果你的仓库是私有的(Private)，就需要多一个步骤。部署非上面命名的仓库。

原创 文心一言AI大模型，前端接入

模型广场：https://console.bce.baidu.com/qianfan/modelcenter/model/buildIn/list。我的应用：https://console.bce.baidu.com/qianfan/ais/console/onlineService。文心一言AI大模型，前端接入。

原创 vue3中，使用23种设计模式

适配器模式：使用Vue3的provide和inject来实现适配器模式。适配器模式：使用Vue3的provide和inject来实现适配器模式。迭代器模式：使用Vue3的for…代理模式：使用Vue3的proxy对象来实现数据的代理。代理模式：使用Vue3的proxy对象来实现代理模式。责任链模式：使用Vue3的事件总线来实现责任链模式。建造者模式：使用Vue3的组件选项来实现建造者模式。责任链模式：使用Vue3的事件总线来实现责任链模式。建造者模式：使用Vue3的组件选项来实现建造者模式。

原创 c++代码代码逻辑走查

自助生物采集代码C++部分流程。

原创 前端代码注释率

LastEditTime”: “Do not edit”, // 设置后，保存文件更改默认更新最后编辑时间。“LastEditors”: “your name”, // 设置后，保存文件更改默认更新最后编辑人。“FilePath”: “Do not edit”, // 设置后，默认生成文件相对于项目的路径。“Date”: “Do not edit”, // 设置后默认设置文件生成时间。“Mailbox”: “[email protected]”,//邮箱。“add(1, 2)”:“// 返回3”

原创 vue摄像头冲突

获取媒体流：navigator.mediaDevices.getUserMedia() 这个函数必须传入要获取的媒体类型约束，格式为{video:true,audio:true} 返回一个 MediaDtream的Promise对象。经过将媒体类型约束修改为{video: { deviceId: ele.deviceId }}来根据不一样的设备id来获取不一样的媒体流。而后将多个媒体流赋值给多个video标签来渲染就OKapp。今天做一个项目，一台设备7个摄像头和高拍仪。

原创 windicss的使用

windicss

原创 websocket使用

考虑到登录之后要始终连接服务器接收消息，所以把websocket实例对象作为模块抛出，在main.js中引入，使全局都可以获得ws并且使用相关方法。由于刷新页面时，ws会自动断开连接，所以在App.vue组件挂载时再次连接服务器。该文件位置任意，引入的时候注意路径即可。

原创 react英文面试

原创 vue 把blob传给后台方法

vue提交blob数据

原创 linkedin的react面试题

7.react createPortal(第一个参数是要渲染的组件，第二个参数是要渲染dom的位置)1.props、setState、this.forceupdate()会引起rerender。this.hug(name, e)}>名字。第二个参数是选填，表示的是属性，eg: className，按钮点击时间，id。第一个参数是必填，传入的是似HTML标签名称，eg: ul, li。// 这句访问this。第三个参数是选填, 子节点，eg: 要显示的文本内容。

原创 css优化--vue2和vue3中虚拟滚动，懒加载实现

假设实际开发中服务端一次响应10万条列表数据，此时设备屏幕只允许容纳10条，那么用户理论上只可以看见10条数据。此时如果前端将10万条数据全部渲染成DOM元素，可能造成程序卡顿，占用较大资源，非常影响用户体验，那么虚拟滚动技术就完美的解决了这一问题。5、使用css3的transform属性将滚动到上方不可见区域的DOM元素偏移到可见区域，同时进行数据的更新(重绘操作节约性能)。4、计算滚动了几个item到顶部不可见区域。3、计算屏幕容纳几个item。2、列表单个item的高度。

原创 pc、移动端自适应css

自适应的一些配置

原创 前端面试指南 — webpack面试篇

webpack面试篇

原创 vue3优化总结

vue3优化总结

原创 websocket使用

websocket使用

原创 vite配置学习

vite使用

原创 react优化

react优化

原创 react hooks介绍

react hooks使用说明

原创 jenkins自动部署

jenkins定时发布

原创 vue架构

vue框架vue-admin-template // 后端管理系统pc版git clone https://github.com/woai3c/vue-admin-template.gitcd vue-admin-templatenpm i

原创 多签名合约

多签名合约// SPDX-License-Identifier: MITpragma solidity >=0.4.22 <0.8.0;pragma experimental ABIEncoderV2;contract Wallet { address[] public approvers; uint8 public quorum; struct Transfer { uint id; uint amount; address payable t

原创 工厂模式创建合约&合约互调

工厂模式创建合约// SPDX-License-Identifier:MITpragma solidity ^0.8.7; //站点contract Station { //站点名称 string private name; //站点位置 string addr; //站点人员数量 uint16 count; //构造函数 constructor(string memory _name, string memory _addr,

原创 solidityABI编码函数

solidityABI编码函数abi.encode(…) returns (bytes)：计算参数的 ABI 编码。自动补全32位字节abi.encodePacked(…) returns (bytes)：计算参数的紧密打包编码abi. encodeWithSelector(bytes4 selector, …) returns (bytes)：计算函数选择器和参数的 ABI 编码abi.encodeWithSignature(string signature, …) returns (byte

原创 go框架学习路径

原创 go入门笔记四(数组、切片、map)

golang切片

原创 go入门笔记五(init函数&方法、interface&闭包函数)

java设计模式(外观模式)

原创 rust入门笔记二 所有权(Ownership)、引用借用

1.Ownership是Rust的一个核心概念。每种编程语言都有自己的一套内存管理的方法。有些需要显式的分配和回收内存（如C），有些语言则依赖于垃圾回收器来回收不使用的内存（如Java）。而Rust不属于以上任何一种，它有一套自己的内存管理规则，叫做Ownership。Rust中常规数据类型，其数据都是存储在栈中，而像String或一些自定义的复杂数据结构（我们以后会对它们进行详细介绍），其数据则存储在堆内存中。Ownership的规则Rust的所有权并不难理解，它有且只有如下三条规则：在Ru

原创 rust入门笔记一

rust入门笔记一rust和c++对标，低级语言1内存安全，c++的悬挂指针、内存越界，不会出现线程安全，多个线程读取一个数据。优秀的泛型支持，比c++的template好模式匹配类型推断2.开发环境2.1rust安装2.2 vscode2.3rust 和 Native Debug、rust-analyzer三个扩展3.创建项目，命令行中输入:cargo new 项目名 //创建项目cargo run //运行项目静态类型：编译时提供数据类型强类型：必须有数据类型动态类型：

原创 js、golang、solidity区别

说明 javascript golang solidity 结构体 没有。但是构造函数就相当于结构体 结构体中我们可以为不同项定义不同的数据类型 同golang 指针 隐式的 显式的 a := "百度" var name *string = &a 隐式的 ...

原创 go入门笔记三(变量)

java设计模式(桥接模式)

原创 go入门笔记二(数据类型及转换、指针)

golang数据类型

原创 go入门笔记一(安装)

golang入门

原创 java实现23种设计模式-创建类

单例模式public class singleton_lazy { // 这是一个main方法，程序的入口 public static void main(String[] args) { }}class LazySingleton{ private static LazySingleton instance; private LazySingleton(){} //私有构造函数，为了避免直接从外面new public static LazySin

原创 拍卖的合约

拍卖合约1.a出价100，最高价=a地址2.b出价200，最高价=b地址pragma solidity ^0.6.1;contract auction_demo{ address payable public seller; // 卖方 address payable public buyer; // 最高价者 uint256 public highAmount; // 最高价 address payable public admin; // 平台方 st

原创 发红包的合约&银行合约

发红包的合约案例分析：pragma solidity ^0.6.1;contract redpacket_demo{ address payable public tuhao; uint256 public rcount; // 红包数量，因为抢一个少一个，所以要记录 uint public ave; mapping(address => bool) isStake; //1.fa hong bao constructor(uint256