<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[wzq2011的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/wzq2011</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; wzq2011]]></copyright><item><title><![CDATA[flutter 凹槽效果]]></title><link>https://blog.youkuaiyun.com/wzq2011/article/details/155275054</link><guid>https://blog.youkuaiyun.com/wzq2011/article/details/155275054</guid><author>wzq2011</author><pubDate>Wed, 26 Nov 2025 15:40:39 +0800</pubDate><description><![CDATA[凹槽效果 flutter]]></description><category></category></item><item><title><![CDATA[uniapp 验证码输入框 20240411]]></title><link>https://blog.youkuaiyun.com/wzq2011/article/details/137630881</link><guid>https://blog.youkuaiyun.com/wzq2011/article/details/137630881</guid><author>wzq2011</author><pubDate>Thu, 11 Apr 2024 11:11:33 +0800</pubDate><description><![CDATA[uniapp 验证码输入框 ，自动下一个位置，删除时回到上一个位置]]></description><category></category></item><item><title><![CDATA[dom元素在容器中拖动实现]]></title><link>https://blog.youkuaiyun.com/wzq2011/article/details/128954178</link><guid>https://blog.youkuaiyun.com/wzq2011/article/details/128954178</guid><author>wzq2011</author><pubDate>Thu, 09 Feb 2023 15:59:40 +0800</pubDate><description><![CDATA[dom  html 元素拖动]]></description><category></category></item><item><title><![CDATA[box-shadow属性中，blur 和 spread区别？chatGPT来回答]]></title><link>https://blog.youkuaiyun.com/wzq2011/article/details/128930284</link><guid>https://blog.youkuaiyun.com/wzq2011/article/details/128930284</guid><author>wzq2011</author><pubDate>Wed, 08 Feb 2023 10:13:45 +0800</pubDate><description><![CDATA[box-shadow属性中，blur与 spread的区别]]></description><category></category></item><item><title><![CDATA[uniapp使用的入坑笔记及demo]]></title><link>https://blog.youkuaiyun.com/wzq2011/article/details/128675821</link><guid>https://blog.youkuaiyun.com/wzq2011/article/details/128675821</guid><author>wzq2011</author><pubDate>Fri, 13 Jan 2023 16:47:26 +0800</pubDate><description><![CDATA[uniapp 使用demo]]></description><category></category></item><item><title><![CDATA[前端html(spa)、后端java通过docker部署]]></title><link>https://blog.youkuaiyun.com/wzq2011/article/details/126160522</link><guid>https://blog.youkuaiyun.com/wzq2011/article/details/126160522</guid><author>wzq2011</author><pubDate>Fri, 05 Aug 2022 11:11:53 +0800</pubDate><description><![CDATA[完整源码在最后
前端资源单独开发和部署，通过nginx来设置html访问路径，并将所有非/api访问路径都指向前端目录。接口服务也是通过docker单独服务注：这里前后端部署在同一个机器（本地localhost）上不同docker容器中前后端没有直接通信，因为docker容器之间直接通信，需要做一些额外配置，这里略过。我这里前后端通过宿主主机（本地192.168.77.49）来通信，实现数据流程 如下 1 - 2 - 3 - 4 - 5 - 6。......]]></description><category></category></item><item><title><![CDATA[Promise 控制并发数]]></title><link>https://blog.youkuaiyun.com/wzq2011/article/details/113871488</link><guid>https://blog.youkuaiyun.com/wzq2011/article/details/113871488</guid><author>wzq2011</author><pubDate>Fri, 19 Feb 2021 21:18:10 +0800</pubDate><description><![CDATA[问题引入
年前遇到这样一个现场写代码的笔试题目，奈何最后没整出来。后来回家经过几翻尝试，promise+sync最终得以实现
需要实现这样一个执行器：

一次性向任务队列添加15个异步任务
执行器在所有异步任务完成后，按任务顺序，在回调方法中传回任务结果数组
执行器最多同时执行4个异步任务

都是码农，直接上代码
    // 定义15个任务，每个任务中都是异步操作
    const p1 = () =&gt; new Promise((resolve, reject) =&gt; setTimeout(]]></description><category></category></item><item><title><![CDATA[拉取代码工具(脚手架)demo]]></title><link>https://blog.youkuaiyun.com/wzq2011/article/details/110938769</link><guid>https://blog.youkuaiyun.com/wzq2011/article/details/110938769</guid><author>wzq2011</author><pubDate>Wed, 09 Dec 2020 19:28:45 +0800</pubDate><description><![CDATA[在平常的工作中，有这样一个场景：
一个包含基础功能的项目，可以作为一套快速开发的标准样本，放到github上分享出来。
每一次要用的时候，git clone拉取一份到本地，进行快速开发。
也可以制作一个脚手架（或者说是npm命令包），比如说create-react-app，我们通过全局安装，在需要新建react项目的地方，直接create-react-app+项目名，即可快速初始化一个项目.
初始化的项目包含了完整的react项目开发的基础内容。
全局安装脚手架（npm会把脚手架加入到全局系统变量中），系统]]></description><category></category></item><item><title><![CDATA[h5效果记录]]></title><link>https://blog.youkuaiyun.com/wzq2011/article/details/110879254</link><guid>https://blog.youkuaiyun.com/wzq2011/article/details/110879254</guid><author>wzq2011</author><pubDate>Tue, 08 Dec 2020 19:14:29 +0800</pubDate><description><![CDATA[记录一下前段时间工作中使用到的h5的效果，方便以后需要时翻出来看看。

滚动中的进度条，代码：
&lt;div class="bottom"&gt;
    &lt;i class="bg"&gt;&lt;/i&gt;
    &lt;i class="wrap"&gt;
        &lt;i class="curr"&gt;&lt;/i&gt;
    &lt;/i&gt;
&lt;/div&gt;
&lt;style&gt;
    .bottom {
        width: 350px;
]]></description><category></category></item><item><title><![CDATA[Nodejs 文件(或目录)复制操作完成后 回调]]></title><link>https://blog.youkuaiyun.com/wzq2011/article/details/110391616</link><guid>https://blog.youkuaiyun.com/wzq2011/article/details/110391616</guid><author>wzq2011</author><pubDate>Mon, 30 Nov 2020 17:15:49 +0800</pubDate><description><![CDATA[前言
现在需要实现这样一个功能，将目录a中所有文件及文件夹复制到目录b，并在整个操作完成后，执行一次某个方法，或者一个回调。
有几种方法可以尝试实现上述功能


遍历目录及文件前，给个计数器，初始值设置在null，文件/目录每读取一个文件，计数器数量增加1（若初始值为null，则直接赋值1），复制完成后数量减少1，每隔某个时间后读取计数器，若计数器不是null并且是0，则表示已经复制完成，调用回调方法。
这种方法 计数可能会不准


遍历目录中都使用同步的方法，nodejs中fs库大部分方法都有同步的实现，]]></description><category></category></item><item><title><![CDATA[水滴效果实现图片切换]]></title><link>https://blog.youkuaiyun.com/wzq2011/article/details/110229567</link><guid>https://blog.youkuaiyun.com/wzq2011/article/details/110229567</guid><author>wzq2011</author><pubDate>Fri, 27 Nov 2020 16:13:51 +0800</pubDate><description><![CDATA[水滴效果实现图片切换
用户点击，从点击位置开始，类似湖水中波浪散开效果来切换下一张图片。

html代码如下:
&lt;div id="wrap"&gt;
    &lt;div id="bg"&gt;&lt;/div&gt;
    &lt;canvas&gt;&lt;/canvas&gt;
&lt;/div&gt;

实现思路是

canvas中画出第一图片
在画布背后再用div#bg中放入第二张图片
用户点击后，画布慢慢透明，div中图片显示
画布透明完成后，立即在画布画出第二张图片，将下一张图片放入]]></description><category></category></item><item><title><![CDATA[canvas中图片大小自适应]]></title><link>https://blog.youkuaiyun.com/wzq2011/article/details/110220251</link><guid>https://blog.youkuaiyun.com/wzq2011/article/details/110220251</guid><author>wzq2011</author><pubDate>Fri, 27 Nov 2020 11:19:44 +0800</pubDate><description><![CDATA[canvas中图片自适应
图片在canvas中自适应大小并居中。
通常图片大小与canvas的大小是不同的，分为以下几种情况

图片高或宽，超过canvas高或宽
图片高、宽，都超过canvas高宽；
图片高、宽都小于canvas高、宽

问题的本质其实是动态计算图片大小，并在canvas适合的位置画出图片
直接上代码
&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
    &lt;meta charset="UTF-8"&gt;
    ]]></description><category></category></item></channel></rss>