<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[qq_42655697的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/qq_42655697</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; qq_42655697]]></copyright><item><title><![CDATA[Kiro AI 助手完整使用指南]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/158582207</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/158582207</guid><author>qq_42655697</author><pubDate>Mon, 02 Mar 2026 19:00:35 +0800</pubDate><description><![CDATA[Kiro AI 助手是一款面向开发者的智能编程工具，提供规范驱动开发(Specs)、自动化触发器(Hooks)和行为定制规则(Steering)三大核心功能。支持Autopilot和Supervised两种工作模式，可自主或半自动完成代码修改、分析、测试等任务。通过结构化Spec文档分解复杂需求，利用Hooks实现事件驱动的自动化流程，结合Steering规则定制AI行为。支持代码追踪、联网搜索、Shell命令执行等能力，显著提升开发效率。]]></description><category></category></item><item><title><![CDATA[预加载和懒加载的区别和使用]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/149403079</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/149403079</guid><author>qq_42655697</author><pubDate>Wed, 16 Jul 2025 17:15:33 +0800</pubDate><description><![CDATA[React 中和。]]></description><category></category></item><item><title><![CDATA[Git Pull 报错处理记录：untracked working tree files would be overwritten by merge]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/149301442</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/149301442</guid><author>qq_42655697</author><pubDate>Sat, 12 Jul 2025 22:45:27 +0800</pubDate><description><![CDATA[本地手动创建的文件如果与远程仓库已有文件重名，在首次 pull 时可能造成冲突。建议新项目开始前，先 pull 下远程内容再添加本地文件，或者避免命名重复。可以通过mv备份冲突文件，再安全地完成合并。]]></description><category></category></item><item><title><![CDATA[Tailwind CSS 设置和问题解决指南]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/149300281</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/149300281</guid><author>qq_42655697</author><pubDate>Sat, 12 Jul 2025 21:25:51 +0800</pubDate><description><![CDATA[在 React + Vite + TypeScript 项目中，Tailwind CSS 不生效，等属性没有效果。]]></description><category></category></item><item><title><![CDATA[新旧接口替换方案——旧接口平滑下线]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/149278444</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/149278444</guid><author>qq_42655697</author><pubDate>Fri, 11 Jul 2025 17:02:35 +0800</pubDate><description><![CDATA[以下是针对的设计方案，通过。]]></description><category></category></item><item><title><![CDATA[React 组件通信方式详解（含示例与优缺点）]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/149123768</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/149123768</guid><author>qq_42655697</author><pubDate>Fri, 04 Jul 2025 19:20:14 +0800</pubDate><description><![CDATA[通信方式适用场景优点缺点props父子组件简单直观、可控性强层层传递繁琐状态提升兄弟组件结构清晰父组件易臃肿Context跨层级祖孙组件解决深层传递问题不适合频繁变化的状态事件总线不相关组件通信解耦灵活不可追踪，易出 bug全局状态管理大型项目，复杂数据共享状态集中、调试方便引入成本高，小项目不推荐组件通信方式没有好坏，只有适不适合你的业务场景。小项目用 props + context 足够，大型项目配合 Zustand/Redux 更高效。]]></description><category></category></item><item><title><![CDATA[利用 TypeScript 高级类型封装动态表单组件（附完整示例）]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/149123634</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/149123634</guid><author>qq_42655697</author><pubDate>Fri, 04 Jul 2025 19:09:27 +0800</pubDate><description><![CDATA[/ 表单字段定义// 类型映射：根据字段值类型推导出控件类型?'input'?'number'?// 生成控件类型映射表// 推导示例/*Result 为：*/这个映射类型UIMap<T>可以在我的表单组件内部自动推导字段所对应的控件类型，避免手动定义字段配置。]]></description><category></category></item><item><title><![CDATA[闭包到底是什么？进来看看]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/149122535</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/149122535</guid><author>qq_42655697</author><pubDate>Fri, 04 Jul 2025 18:06:02 +0800</pubDate><description><![CDATA[场景是否推荐说明私有变量封装✅高内聚，数据安全工厂函数/记忆函数✅强可复用性高频 DOM 事件闭包❌易泄漏大量闭包动态创建⚠️谨慎使用。]]></description><category></category></item><item><title><![CDATA[React is not defined其他处理方法都试过了还是不行]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/140043841</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/140043841</guid><author>qq_42655697</author><pubDate>Fri, 28 Jun 2024 15:08:48 +0800</pubDate><description><![CDATA[如果代码编译没有问题，但是浏览器就是打不开项目，并且控制台报错React is not defined，那么！用其他浏览器打开试试，如果可以的话，那大概率就是你的这个浏览器缓存过期了！清理一下缓存就好了，根本不用把依赖删来删去安来安去呜呜呜。]]></description><category></category></item><item><title><![CDATA[react基础-安装到开发]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/117249539</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/117249539</guid><author>qq_42655697</author><pubDate>Tue, 25 May 2021 10:32:16 +0800</pubDate><description><![CDATA[一、安装（win10系统）
1.安装node.js
2.安装react
win+r打开cmd，按顺序输入

npm install -g create-react-app
create-react-app检查是否安装好，如下图

3.输入cmd进一个你想建项目的文件夹

4.输入 create-react-app react-demo ，然后等，下图是安装好了

5.输入 cd react-demo 进入项目包，再输入 npm run start，出现下面界面就成功了


3.项目目录结构
参考：https]]></description><category></category></item><item><title><![CDATA[模仿ctrl+f全局循环搜索]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/116488737</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/116488737</guid><author>qq_42655697</author><pubDate>Fri, 07 May 2021 12:52:40 +0800</pubDate><description><![CDATA[&lt;div class="search_input"&gt;&lt;input v-model="searchitem" @keyup.enter="searchSubmit" @input="searchitemClear" placeholder="搜索会议内容" /&gt;&lt;/div&gt;

data中定义  searchhead
//  搜索内容把对应内容变为红色   
changeColor(item) {
  let searchitem = this.searchitem; //获]]></description><category></category></item><item><title><![CDATA[前端vue二维码生成 组件qrcode.js]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/115127076</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/115127076</guid><author>qq_42655697</author><pubDate>Tue, 23 Mar 2021 15:55:17 +0800</pubDate><description><![CDATA[安装依赖
npm install --save qrcode

父组件
结构：
&lt;QRcode :url='url' /&gt;

数据：
&lt;script&gt;
  import QRcode from '@/components/QRcode'
  export default {
    components: {
      QRcode
    },
    data() {
      return {
        url: "",
      }
    },

  }

&l]]></description><category></category></item><item><title><![CDATA[AES前端加密ECB模式和CBC模式vue]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/115124604</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/115124604</guid><author>qq_42655697</author><pubDate>Tue, 23 Mar 2021 15:41:49 +0800</pubDate><description><![CDATA[区别
ECB： 是一种基础的加密方式，密文被分割成分组长度相等的块（不足补齐），然后单独一个个加密，一个个输出组成密文。
​
CBC： 是一种循环模式，前一个分组的密文和当前分组的明文异或或操作后再加密，这样做的目的是增强破解难度。（不容易主动攻击，安全性好于ECB，是SSL、IPSec的标准）
1.加密先安装依赖
npm install crypto-js --save-dev

2.引入
  import AES from '../common/AES'  // 需要封装的，AES.js封装文件在后面
]]></description><category></category></item><item><title><![CDATA[js前端图片转base64]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/115125236</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/115125236</guid><author>qq_42655697</author><pubDate>Tue, 23 Mar 2021 15:19:12 +0800</pubDate><description><![CDATA[图片转base64
将图片转成base64显示在页面上，好处是可以实现网页图片在网速 不好的时候先于内容加载和减少http的请求次数来减少网站服务器的负担
var canvas = document.createElement('canvas')
var ctx = canvas.getContext('2d');
 // quality值越小，所绘制出的图像越模糊
var base64 = canvas.toDataURL('image/jpeg',quality);


...]]></description><category></category></item><item><title><![CDATA[vue+element el-pagination后端分页bug]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/115112299</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/115112299</guid><author>qq_42655697</author><pubDate>Tue, 23 Mar 2021 10:51:53 +0800</pubDate><description><![CDATA[bug描述

当搜索结果总页数小于当前所在页码，会显示“暂无数据”，实际上有数据
产生原因：我们搜索的时候向接口查询数据，传的currentpage是当前的，但是想搜索的数据并没有那么多页，所以会无法显示数据

解决思路

他搜索的时候，重新渲染页面，页码传1过去

解决方法

定义pageshow，默认为true，search的时候让他变成false，再重新渲染页面，改变currentpage，再让pageshow变成true，pageshow绑定在分页上
步骤（从上至下）：
1.搜索处： @chang.]]></description><category></category></item><item><title><![CDATA[element可手指滑动走马灯，轮播图]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/115111595</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/115111595</guid><author>qq_42655697</author><pubDate>Tue, 23 Mar 2021 10:38:35 +0800</pubDate><description><![CDATA[1.定义一个ref
&lt;el-carousel type="card" :autoplay="false" arrow="never" 
ref="slideCarousel" @change="setActiveItem"&gt;
   &lt;el-carousel-item v-for="item in imgList" :key="item.id"&gt;
      &lt;img class="element-img" alt="暂无" :src="item.url" @click="upl]]></description><category></category></item><item><title><![CDATA[vue前端上传图片预览]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/114942282</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/114942282</guid><author>qq_42655697</author><pubDate>Wed, 17 Mar 2021 18:22:59 +0800</pubDate><description><![CDATA[前端上传图片在浏览器上预览，不调接口，刷新后图片就会没有
&lt;div class="btn"&gt;
   &lt;button&gt;上传背景图片&lt;input id="fileToUpload" 
   style="position: absolute; top: 0; bottom: 0; left: 0;right: 0; opacity: 0;" 
   type="file" accept="image/jpg,image/png" name="fileToUpload" 
   @c]]></description><category></category></item><item><title><![CDATA[设置接口响应时间]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/114941914</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/114941914</guid><author>qq_42655697</author><pubDate>Wed, 17 Mar 2021 18:16:18 +0800</pubDate><description><![CDATA[1.axios全局设置
axios.js中：

或者直接写：axios.defaults.timeout = 30 * 1000; // 30s
2.单独对某一个请求设置

3.webpack的dev的proxyTable的超时时间设置
  dev: {
    // Paths
    assetsSubDirectory: 'static', // 静态资源文件夹
    assetsPublicPath: '/', // 发布路径
    // 代理配置表，在这里可以配置特定的请求代理到对应的API接]]></description><category></category></item><item><title><![CDATA[css3设置背景图始终平铺]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/114941711</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/114941711</guid><author>qq_42655697</author><pubDate>Wed, 17 Mar 2021 18:11:27 +0800</pubDate><description><![CDATA[直接复制代码到背景的div上
&lt;div class="bgimg"&gt;&lt;/div&gt;

/* 设置背景 */
.bgimg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  min-width: 1200px;
  z-index: -10;
  zoom: 1;
  background-color: #dfc9d4;
  background: url('../../assets/im]]></description><category></category></item><item><title><![CDATA[filter+include实现 动态按钮 切换 动态按钮]]></title><link>https://blog.youkuaiyun.com/qq_42655697/article/details/114940683</link><guid>https://blog.youkuaiyun.com/qq_42655697/article/details/114940683</guid><author>qq_42655697</author><pubDate>Wed, 17 Mar 2021 17:54:50 +0800</pubDate><description><![CDATA[需求
5个模式按钮，8个控制按钮，通过点击模式按钮来显示不同的控制按钮。
难点
因为这些按钮都是通过动态渲染出来的，所以不好控制显示，一开始想的是通过type传参，然后用switch选择，判断这个模式显示什么按钮，再去修改渲染控制按钮的数组，从而实现控制按钮的变化。
解决思路
1.模式按钮数组modelList：在每个模式按钮中定义一个参数type，用来分辨选择的模式；
2.控制按钮数组handleList：显示所有按钮，然后在每个控制按钮中定义一个type，存储这个按钮在哪些模式中显示；（一开始的控制ty]]></description><category></category></item></channel></rss>