<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[gebieren的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/gebieren</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; gebieren]]></copyright><item><title><![CDATA[vue3中通过ref用于注册元素或子组件的引用。]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/129102186</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/129102186</guid><author>gebieren</author><pubDate>Sat, 18 Feb 2023 17:14:43 +0800</pubDate><description><![CDATA[vue中获取元素或组件的方法]]></description><category></category></item><item><title><![CDATA[计算嵌套数组的深度]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/128875449</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/128875449</guid><author>gebieren</author><pubDate>Fri, 03 Feb 2023 20:09:20 +0800</pubDate><description><![CDATA[计算数组的深度]]></description><category></category></item><item><title><![CDATA[递归返回嵌套对象的深度]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/128875188</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/128875188</guid><author>gebieren</author><pubDate>Fri, 03 Feb 2023 19:45:35 +0800</pubDate><description><![CDATA[递归获取嵌套对象的深度]]></description><category></category></item><item><title><![CDATA[瀑布流布局之一（css）]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/128399710</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/128399710</guid><author>gebieren</author><pubDate>Wed, 21 Dec 2022 17:26:05 +0800</pubDate><description><![CDATA[column多列布局实现瀑布流，主要使用了column-count和column-gap属性，column-count属性用来设置列数，column-gap属性用来设置列于列之间得间距。项目菜单下拉数据太多，无法一次性展示全，项目经理就提出来要仿阿里云做个平铺展示的菜单详情，搞了半天才知道右侧展示是瀑布流，学到了就记录下来，以此为鉴。]]></description><category></category></item><item><title><![CDATA[token失效登录后跳转到之前页面]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/128291133</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/128291133</guid><author>gebieren</author><pubDate>Mon, 12 Dec 2022 18:13:27 +0800</pubDate><description><![CDATA[打开页面长期没有使用，再次使用或者刷新就会返回登录页的情况，对于登录后，希望能够返跳转到之前的页面，只需要做一个重定向就行。]]></description><category></category></item><item><title><![CDATA[配置用户代码片段（vue.code-snippets）]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/128248382</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/128248382</guid><author>gebieren</author><pubDate>Fri, 09 Dec 2022 10:20:51 +0800</pubDate><description><![CDATA[为了提高开发效率，很多时候会在vscode中配置好一些常用的代码片段，省时省力还显示你很NB。说明：vue.code-snippets文件放在**.vscode**里面。以下是基于vue3跟Ts个人的配置，分享出来（代码直接复制到。文件即可使用，可根据个人情况进行修改prefix)。]]></description><category></category></item><item><title><![CDATA[vue项目中，js代码动态控制网页的link标签与title内容]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/128239035</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/128239035</guid><author>gebieren</author><pubDate>Thu, 08 Dec 2022 16:28:15 +0800</pubDate><description><![CDATA[最近正在开发一个微模块系统，产品想要根据子系统的不同，动态生成link标签与title中的内容，于是就做了一个简单的demo，希望分享出来给到后续有同样需求的伙伴，共勉。首先肯定是需要有一套**.svg**的图标来对应相应的系统，那就安排（我是放在public文件中，这样build的时候不会进行处理，方便随时根据ui设计进行替换）。]]></description><category></category></item><item><title><![CDATA[vue3+ts实现iframe父页面与子页面如何传值 demo]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/128147607</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/128147607</guid><author>gebieren</author><pubDate>Fri, 02 Dec 2022 14:35:08 +0800</pubDate><description><![CDATA[【代码】vue3+ts实现iframe父页面与子页面如何传值 demo。]]></description><category></category></item><item><title><![CDATA[加密与解密方法的封装（基于crypto-js），个人推荐js-md5,用起来更方便]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/128144921</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/128144921</guid><author>gebieren</author><pubDate>Fri, 02 Dec 2022 11:13:49 +0800</pubDate><description><![CDATA[在登入或者传参的时候，为了保证信息的不公开信，有时候就需要用到加密，下面是自己封装的一套方法，可以直接使用。]]></description><category></category></item><item><title><![CDATA[node实现读取文件并输出文件名，lodash进行处理不同的文件名]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/128144124</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/128144124</guid><author>gebieren</author><pubDate>Fri, 02 Dec 2022 10:45:56 +0800</pubDate><description><![CDATA[每次前端打包生成的dist文件，可能会有很多的文件，对于未修改的情况，多次build后，会出现打包的文件名（hash值）变化的问题（参考vue官网history与hash路由的区别:https://router.vuejs.org/zh/guide/essentials/history-mode.html），，无法判断最终导致的副作用，这个时候就需要去进行文件的对比。]]></description><category></category></item><item><title><![CDATA[仿百度控制台输出、控制台输出版本等]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/127993602</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/127993602</guid><author>gebieren</author><pubDate>Wed, 23 Nov 2022 09:22:35 +0800</pubDate><description><![CDATA[需求：项目上线后，有时候出现问题，无法知道是哪个版本、发布时间、打包机器之类的信息，当然对于有特殊信息展示的，针对特定人群，那就需要在控制台进行记录一些东西，方便查看。对于直接在index.html中写的方式，更倾向于静态的一些资源展示，比如图片，文案，链接等。2.单独文件进行处理。（下面就以vite.config.ts为例）标签的嵌入写法就可以。对于类似的输入，下面介绍两种方式进行实现。]]></description><category></category></item><item><title><![CDATA[使用group by让数据快速归类（可以指定归类依据）]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/127260816</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/127260816</guid><author>gebieren</author><pubDate>Tue, 11 Oct 2022 11:51:33 +0800</pubDate><description><![CDATA[使用group by方法之前需要下载 npm install lodash-es及引入import { groupBy } from ‘lodash-es’;]]></description><category></category></item><item><title><![CDATA[vscode 终端不能使用yarn指令[绝密]]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/126875469</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/126875469</guid><author>gebieren</author><pubDate>Thu, 15 Sep 2022 17:17:53 +0800</pubDate><description><![CDATA[vscode 中无法使用全局下载的yarn指令]]></description><category></category></item><item><title><![CDATA[handsontable 踩过的坑（渲染不全、错位）]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/123684762</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/123684762</guid><author>gebieren</author><pubDate>Wed, 23 Mar 2022 14:15:37 +0800</pubDate><description><![CDATA[第一次使用handsontable ，遇到了一些问题，希望能帮助后来人。

问题1：表格渲染一部分或展示不全的问题。









解决方式：


  &lt;HotTable
                v-model="changeFlag"
            :root="root"
            ref="testHot"
            :settings="hotSettings"
          &gt;
          &lt;/HotTab...]]></description><category></category></item><item><title><![CDATA[样式操作（className)]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/120560003</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/120560003</guid><author>gebieren</author><pubDate>Thu, 30 Sep 2021 08:57:36 +0800</pubDate><description><![CDATA[通过className属性对元素的类名进行操作。
通过HTML5新增的classList属性对元素的类名进行操作。
通过Style属性设置元素的行内样式。
通过getComputedStyle方法获取元素的计算后样式。
通过offset系列，scroll系列，client系列属性来操作元素的组合样式。

ClassName操作

说明：通过ClassName操作元素的类名是最简单的方式，但是如果仅仅想增加或者删除某一个具体的类名的时候，不是特别方便。
ClassList属性

说明：使用classList.]]></description><category></category></item><item><title><![CDATA[通过CSS生成网格线背景]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/111935261</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/111935261</guid><author>gebieren</author><pubDate>Tue, 29 Dec 2020 19:09:09 +0800</pubDate><description><![CDATA[前段时间，设计图有背景是网格线的，开始想着直接用svg图进行展示，后面老大不同意，说可以直接用css样式生产的，最好不要svg,加载好性能，经过尝试，css处理起来也是特别简单的：



附上代码：


.grid_line {
  width: 100%;
  height: 100%;
  text-align: center;
  color: blue;
  box-sizing: border-box;
  border: 1px solid #ccc;
  background: -webkit]]></description><category></category></item><item><title><![CDATA[封装根据年月得出有某个月多少天]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/109992964</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/109992964</guid><author>gebieren</author><pubDate>Mon, 23 Nov 2020 13:29:02 +0800</pubDate><description><![CDATA[由于所处项目上经常会用到时间的组建，对于每个月多少天默认值就不太好处理，后面查了一些文件，自己就直接封装了一套Ts的方法。
传入参数：time  2020-11

private  formatDate(time: string)｛
let data = new Date（）
let currentYear = +time.split("-")[0]    // 2020
let currentMouth = +time.split("-")[1]   //11
const  haveBigMouths =]]></description><category></category></item><item><title><![CDATA[el-tree的懒加载数据除去没有用到的三角形图标或最后一级三角形）]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/108977681</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/108977681</guid><author>gebieren</author><pubDate>Fri, 09 Oct 2020 14:37:48 +0800</pubDate><description><![CDATA[由于点击节点才去渲染子层（下一层）的数据，通过操作dom的方法去获取元素并改变其样式（display:none）并不容易，而且容易获取失败！
通过多次尝试，利用el-tree固有的属性props中的isLeaf可以直接指定你需要隐藏某个节点的三角形！
html结构如下：
&lt;el-tree :props="props" lazy  :date="data" :load="loadNode"&gt;&lt;/el-tree&gt;

ts代码（js在data中申明即可）去定义***props***:
pr]]></description><category></category></item><item><title><![CDATA[javaScript encodeURL与encodeURLComponent区别]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/108080283</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/108080283</guid><author>gebieren</author><pubDate>Tue, 18 Aug 2020 16:39:39 +0800</pubDate><description><![CDATA[1. URL编码及解码方式

Global对象的encodeURL()和encodeURLComponent()方法可以对URL进行编码。有效的URL中不能包含某些字符串，例如空格。他们用特殊的UTF-8编码替换所有无效的字符，从而让浏览器理解。
encodeURL()主要用于整个URL，而encodeURLComponent()主要用于对URL中的某一段。它们的区别在于，encodeURL()不会对本身属性url的特殊字符进行编码，例如“冒号、正斜杠、问号、井号”；而encodeURLComponent(]]></description><category></category></item><item><title><![CDATA[控制页面无法右键及复制的两种方式（js 与 css)]]></title><link>https://blog.youkuaiyun.com/gebieren/article/details/107971812</link><guid>https://blog.youkuaiyun.com/gebieren/article/details/107971812</guid><author>gebieren</author><pubDate>Thu, 13 Aug 2020 09:10:15 +0800</pubDate><description><![CDATA[js控制页面无法复制：


 &lt;script type="text/javascript"&gt;
  //Method one
  //&lt;![CDATA[ 
  //document.oncontextmenu=new Function('event.returnValue=false;');
  document.oncontextmenu = function (e) { e = e || window.event; e.returnValue = false; }
  document.]]></description><category></category></item></channel></rss>