<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[zuo0407的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/zuo0407</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; zuo0407]]></copyright><item><title><![CDATA[【CryptoJS】解密/加密]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/143188467</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/143188467</guid><author>zuo0407</author><pubDate>Wed, 23 Oct 2024 16:53:21 +0800</pubDate><description><![CDATA[解密/加密 Decrypt, Encrypt ]]></description><category></category></item><item><title><![CDATA[js 获取树节点上某节点的最底层叶子节点数据]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/142388211</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/142388211</guid><author>zuo0407</author><pubDate>Fri, 20 Sep 2024 16:13:03 +0800</pubDate><description><![CDATA[之前有个面试题，让把上面的多维数组转换为一维数组，我在那递归，傻批一个，被自己蠢死。每天一个知识点get！flatMap方法：使用映射函数映射每个元素，然后将结果压缩成一个新数组。数据为某一个节点对象。]]></description><category></category></item><item><title><![CDATA[自动生成表单及表格界面]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/142140826</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/142140826</guid><author>zuo0407</author><pubDate>Wed, 11 Sep 2024 16:55:13 +0800</pubDate><description><![CDATA[数据结构定好后，循环组件即可，时间有限，后续加上代码。另：字段间有联动关系的，也要整理出来。]]></description><category></category></item><item><title><![CDATA[Vue3 + TS + Antd + Pinia 从零搭建后台系统(四) ant-design-vue Layout布局，导航栏，标签页]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/139800464</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/139800464</guid><author>zuo0407</author><pubDate>Wed, 19 Jun 2024 13:52:17 +0800</pubDate><description><![CDATA[使用unplugin-vue-components插件完成ant-design-vue组件的按需加载。此处用到的图标为iconfont图标库中的图标，可替换为ant-design-vue中的图标。此处还需在tsconfig.json同级添加文件 components.d.ts。项目至此基本搭建结束。后续优化或添加功能，不定期更新。这里统一写在layout文件夹下面。前文中已处理过，详情见前文。]]></description><category></category></item><item><title><![CDATA[Vue3 + TS + Antd + Pinia 从零搭建后台系统(三) Pinia + 全局loading + 公共方法]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/139530844</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/139530844</guid><author>zuo0407</author><pubDate>Fri, 07 Jun 2024 17:04:33 +0800</pubDate><description><![CDATA[想了解Pinia的可看该博主的文章，挺详细的。此篇不做讲解，只讲实际应用。此处为了接口的规范性，添加了interface。在api文件夹中添加接口文件types.ts。]]></description><category></category></item><item><title><![CDATA[Vue3 + TS + Antd + Pinia 从零搭建后台系统(二) Ajax + Router]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/139528851</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/139528851</guid><author>zuo0407</author><pubDate>Fri, 07 Jun 2024 16:28:20 +0800</pubDate><description><![CDATA[规范一点，我们使用interface规范数据，创建一个types文件。本篇结束，后面文章继续填充：Pinia + Utils公共方法。]]></description><category></category></item><item><title><![CDATA[Vue3 + TS + Antd + Pinia 从零搭建后台系统(一) 脚手架搭建 + 入口配置]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/139527114</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/139527114</guid><author>zuo0407</author><pubDate>Fri, 07 Jun 2024 15:44:07 +0800</pubDate><description><![CDATA[在这里插入图片描述](https://img-blog.csdnimg.cn/direct/6d6dbe3cfd0643d3a8dcab5353b5460e.png。然后用pnpm安装依赖，生成node_modules及pnpm-lock.yaml文件（以下为demo依赖的效果图）此篇Over，未完待续，其他文章更新Ajax通信和路由设置（含动态路由）等。呐----一步一步走，首先我们要有个架子，然后慢慢往里面填充。注：此文件和mian.ts同级。这时候已经可以运行项目了。使用Vite创建项目。]]></description><category></category></item><item><title><![CDATA[Excel日期数字转化成时间格式]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/138676711</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/138676711</guid><author>zuo0407</author><pubDate>Fri, 10 May 2024 18:33:22 +0800</pubDate><description><![CDATA[【代码】Excel日期数字转化成时间格式。]]></description><category></category></item><item><title><![CDATA[复制表格内容至剪切板（含数据转换）]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/132084430</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/132084430</guid><author>zuo0407</author><pubDate>Thu, 03 Aug 2023 16:16:18 +0800</pubDate><description><![CDATA[根据当前行数据及列配置中的枚举值，转换数据；拓展出下拉框枚举是树形结构的，支持深层次遍历。处理每一个单元格数据，进行格式化数据。]]></description><category></category></item><item><title><![CDATA[XLSX.js实现多sheet页导出，并设置行样式]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/131582810</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/131582810</guid><author>zuo0407</author><pubDate>Thu, 06 Jul 2023 18:20:28 +0800</pubDate><description><![CDATA[【代码】XLSX.js实现多sheet页导出，并设置行样式。]]></description><category></category></item><item><title><![CDATA[【Electron】用前端技术开发桌面应用（一）]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/119924172</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/119924172</guid><author>zuo0407</author><pubDate>Mon, 21 Feb 2022 13:12:18 +0800</pubDate><description><![CDATA[由于最近工作需求，紧急学习electron相关的技术知识，关于node.js的相关问题，后续会继续更新。
【electron】简介及作用：
electron的基本组成：Chromium + Node.js + Native API
Chromium：Google 的Chrome浏览器背后的引擎，为electron提供了强大的UI能力，不用考虑兼容性的问题，比如可以不用写很多CSS兼容代码；
Node.js：可以使用npm的包快速开发，并且使electron有底层开发的能力，比如文件的读写等；
Native ]]></description><category></category></item><item><title><![CDATA[【Node.js】Node.js攻略（二）npm及事件循环]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/118728742</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/118728742</guid><author>zuo0407</author><pubDate>Fri, 06 Aug 2021 17:18:59 +0800</pubDate><description><![CDATA[什么是NPM？
NPM是随同NodeJS一起安装的包管理工具，能解决NodeJS代码部署上的很多问题。（注：Yarn 是 npm 的一个替代选择。）
常见的使用场景有以下几种：

允许用户从NPM服务器下载别人编写的第三方包到本地使用。
允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。

由于新版的node.js已经集成了npm，所以之前npm也一并安装好了。
可以通过输入 “npm -v” 来测试是否成功安装。命令如下，出现]]></description><category></category></item><item><title><![CDATA[【Vue + node】node攻略（一）]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/118328134</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/118328134</guid><author>zuo0407</author><pubDate>Wed, 07 Jul 2021 16:55:03 +0800</pubDate><description><![CDATA[先了解一下node是什么，有什么特点，可以干什么，经常干什么
【初识node】
官方文档记录：
Node.js 是一个开源与跨平台的 JavaScript 运行时环境。
Node.js 在浏览器外运行 V8 JavaScript 引擎（Google Chrome 的内核）。
Node.js 应用程序运行于单个进程中，无需为每个请求创建新的线程。
Node.js 在其标准库中提供了一组异步的 I/O 原生功能（用以防止 JavaScript 代码被阻塞），并且 Node.js 中的库通常是使用非阻塞的范式编写]]></description><category></category></item><item><title><![CDATA[【Vue + bpmn】前端实现画流程图]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/116797734</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/116797734</guid><author>zuo0407</author><pubDate>Mon, 28 Jun 2021 17:54:03 +0800</pubDate><description><![CDATA[新业务下来要搞流程图，作为笔记仅供参考，记录此次渡劫历程
技术：使用vue + ts + bpmn
安装bpmn.js
实现创建编辑流程图，首先我们需要安装 bpmn.js。材料要先有，才能根据自己的需要去锻造适合自己的兵器
npm i bpmn.js --save -D

注：安装完成后可以在node-modules中找到bpmn-font，bpmn-js，bpmn-moddle文件夹
ts文件引入bpmn
// 左侧工具栏及编辑节点的样式
import 'bpmn-js/dist/assets/diag]]></description><category></category></item><item><title><![CDATA[【Vue3】李南江老师讲解--个人笔记（三）]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/115004585</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/115004585</guid><author>zuo0407</author><pubDate>Fri, 19 Mar 2021 18:02:52 +0800</pubDate><description><![CDATA[【 Vue3笔记 】
【 toRaw() 方法 】
toRaw() 方法专门用来获取 ref 或者 reactive 类型的原始数据，如果是获取 ref 类型的原始数据，需要在对象后面添加 .value。
获取原始数据的作用：由于 ref 和 reactive 数据类型每次修改都会被追踪并更新UI界面（消耗性能），如果有些操作不需要监听 和更新UI界面，可以先使用toRaw获取原始数据，对原始数据进行修改。

【 markRaw() 方法 】
markRaw方法：定义数据永远不被追踪，变成非响应式数据，这时]]></description><category></category></item><item><title><![CDATA[【Vue3】李南江老师讲解--个人笔记（二）ref 和 reactive详解]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/114137166</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/114137166</guid><author>zuo0407</author><pubDate>Mon, 15 Mar 2021 17:35:08 +0800</pubDate><description><![CDATA[【vue3笔记】
实现响应式数据的方法
可以使用 ref，reactive定义响应式数据，本质上就是将传入的数据包装成一个Proxy对象。
使用 reactive 必须是对象（Json/arr），如果给 reactive 传递了其他的对象，默认情况下修改对象，页面不会自动更新。但是可以通过重新赋值的形式更新页面。
&lt;template&gt;
	&lt;div&gt;
		&lt;p&gt;{{value.time}}&lt;/p&gt;
		&lt;button @click="myFn"&gt;按钮]]></description><category></category></item><item><title><![CDATA[【Vue3】李南江老师讲解--个人笔记（一）]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/113858657</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/113858657</guid><author>zuo0407</author><pubDate>Fri, 26 Feb 2021 15:56:18 +0800</pubDate><description><![CDATA[太喜欢李南江老师了，自带二倍速的语速还可以讲的明明白白又有一个有趣的灵魂i了i了
【vue笔记】
框架和库的区别：
框架：是一整套的完整的解决方案，换框架的话，需要重构整个项目；库：也就是使用是插件，修改需要使用的插件就可以，可以实现无缝切换。
vue的核心概念：
1，通过数据驱动界面更新，不操作Dom来更新页面；2，组件化开发，可以将网页拆分成一个个的组件来编写
let vm = new Vue({
    router,
    store,
    el: '#app',
    render: (h]]></description><category></category></item><item><title><![CDATA[设置vscode背景图片]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/112562893</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/112562893</guid><author>zuo0407</author><pubDate>Wed, 13 Jan 2021 14:46:20 +0800</pubDate><description><![CDATA[首先在vscode扩展中，找到background这个插件，快捷键Ctrl+shift+x

然后，在设置中找到settings.json文件

再然后，在文件下面添加以下代码：

    "background.customImages": [
    "file:///E:/file/Googlefile/4.png" //本地图片
    ],
    //background 的相关配置
    "update.enableWindowsBackgroundUpdates": true,
    "]]></description><category></category></item><item><title><![CDATA[【Vue-router】hash模式和history模式]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/112508866</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/112508866</guid><author>zuo0407</author><pubDate>Tue, 12 Jan 2021 16:25:21 +0800</pubDate><description><![CDATA[经过前一段时间磕路由的官方文档及做了一些实验，我终于是个废人了。现在对路由的了解，可能是由之前的‘人畜不分’阶段变成了‘这是个会做什么东西的人’阶段。前路漫漫，继续磕吧！刚嘛嘚！！
现在单页应用盛行，前端路由也成为目前各个框架的基础标配，然后就搞得路由也是一大难题，越来越复杂，对于我这个小菜鸡来说，啃这个骨头，还是挺费头发的。
今天总结两个牛掰哄哄的两个框架（React和Vue）的hash模式和history模式。
先介绍一下，前端路由、hash模式及history模式到底是什么玩意儿
前端路由 ：在服务端]]></description><category></category></item><item><title><![CDATA[Vue面试题总结（二）之  vue-router]]></title><link>https://blog.youkuaiyun.com/zuo0407/article/details/111556286</link><guid>https://blog.youkuaiyun.com/zuo0407/article/details/111556286</guid><author>zuo0407</author><pubDate>Mon, 11 Jan 2021 18:04:52 +0800</pubDate><description><![CDATA[vue-router是什么
Vue Router 是 Vue.js 官方的路由管理器，创建单页应用程序：通过Vue.js，我们已经在使用组件组成应用程序。将Vue Router添加到混合中时，我们要做的就是将组件映射到路由，并让Vue Router知道在哪里渲染它们
vue-router 的功能
嵌套的路由/视图表
模块化的、基于组件的路由配置
路由参数、查询、通配符
基于 Vue.js 过渡系统的视图过渡效果
细粒度的导航控制
带有自动激活的 CSS class 的链接
HTML5 历史模式或 hash ]]></description><category></category></item></channel></rss>