<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[Coloryi的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/Coloryi</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; Coloryi]]></copyright><item><title><![CDATA[在vue中表格滚动加载数据的几种方式]]></title><link>https://blog.youkuaiyun.com/Coloryi/article/details/109370536</link><guid>https://blog.youkuaiyun.com/Coloryi/article/details/109370536</guid><author>Coloryi</author><pubDate>Thu, 29 Oct 2020 22:01:00 +0800</pubDate><description><![CDATA[在vue中表格滚动加载数据的几种方式

表格滚动加载数据本次将分两种类型进行讲解，分别是表格内加载（即监听el-table中的滚动事件，好处是表格的表头可以固定住）、表格的父级元素绑定滚动时间加载数据。

一、监听表格内的滚动事件（可固定住表头）

1、vue-infinite-loading

使用文档说明链接：vue-infinite-loading

好处是：可以固定住表头，监听表格的滚动，且每次滚动到底部加载完数据，滚动条依旧停留在上一次的浏览记录中

坏处是：在首次如果数据没有能够撑开表格的高度，]]></description><category></category></item><item><title><![CDATA[解决Node.js读取MySQL的时间格式不对]]></title><link>https://blog.youkuaiyun.com/Coloryi/article/details/105009704</link><guid>https://blog.youkuaiyun.com/Coloryi/article/details/105009704</guid><author>Coloryi</author><pubDate>Sat, 21 Mar 2020 14:42:30 +0800</pubDate><description><![CDATA[最近在做毕设，从MySQL数据库中读取时间，按照网上去修改数据库的time_zong,修改了好久都没用，后来别人说是因为js读取是会默认的（但也不知道是不是真的）。最终使用moment,终于解决了，具体步骤如下所示：

     1、安装

      cnpm install moment --save

      2、使用

 ...]]></description><category></category></item><item><title><![CDATA[借一道面试题讲讲promise、async和await在事件循环中的执行顺序]]></title><link>https://blog.youkuaiyun.com/Coloryi/article/details/100773623</link><guid>https://blog.youkuaiyun.com/Coloryi/article/details/100773623</guid><author>Coloryi</author><pubDate>Sat, 14 Sep 2019 00:04:17 +0800</pubDate><description><![CDATA[题目如下所示：


async function a1 () {
    console.log('a1 start')
    await a2()
    console.log('a1 end')
}
async function a2 () {
    console.log('a2')
}
console.log('script start')
setTimeout(() =&gt; {...]]></description><category></category></item><item><title><![CDATA[防抖和节流]]></title><link>https://blog.youkuaiyun.com/Coloryi/article/details/97969553</link><guid>https://blog.youkuaiyun.com/Coloryi/article/details/97969553</guid><author>Coloryi</author><pubDate>Wed, 31 Jul 2019 22:11:53 +0800</pubDate><description><![CDATA[1、防抖：就是规定在一段时间内，事件只执行一次，如果在规定的时间里面，再次触发该事件，那么将会重新计时
2、例子：老师告诉学生们，如果在一个星期内不会上课睡觉，就奖励一颗棒棒糖，如果在这段时间内，有人违规了，那么就从这一刻开始重新计时，过一个星期就可以领到棒棒糖了
3、代码示例如下：
function debounce(fn,wait) {
 let timer = null
 re...]]></description><category></category></item><item><title><![CDATA[父子组件间传值，父传子，子传父]]></title><link>https://blog.youkuaiyun.com/Coloryi/article/details/90078131</link><guid>https://blog.youkuaiyun.com/Coloryi/article/details/90078131</guid><author>Coloryi</author><pubDate>Fri, 10 May 2019 16:59:32 +0800</pubDate><description><![CDATA[父子组件给子组件传值

 第一步：爸爸将数据递给儿子，所以我们就需要在子组件绑定父组件的数据

 第二步：爸爸都已经将数据给你了，那么你就要礼貌性的伸手去拿，这时我们可以利用props去接爸爸传过来的值

 第三步：当你拿到值的时候，就可以随意发挥数据的作用啦

代码如下：




父组件：
&lt;template&gt;
  &lt;div id="a...]]></description><category></category></item><item><title><![CDATA[在vue-cli项目中模拟后台数据]]></title><link>https://blog.youkuaiyun.com/Coloryi/article/details/89526338</link><guid>https://blog.youkuaiyun.com/Coloryi/article/details/89526338</guid><author>Coloryi</author><pubDate>Thu, 25 Apr 2019 21:40:25 +0800</pubDate><description><![CDATA[一、使用mock模拟后台数据

1、安装

  npm install mockjs -S

2、在项目建立相应文件



3、img.json文件的代码如下：


{
   "img": [
       {
           "url": "http://pic15.nipic.com/20110628/1369025_192645024000_2.jpg"
       },
 ...]]></description><category></category></item><item><title><![CDATA[vue之slot的理解]]></title><link>https://blog.youkuaiyun.com/Coloryi/article/details/89523100</link><guid>https://blog.youkuaiyun.com/Coloryi/article/details/89523100</guid><author>Coloryi</author><pubDate>Thu, 25 Apr 2019 20:23:26 +0800</pubDate><description><![CDATA[一、初步了解slot

什么是slot呢？通俗的来说就是“占坑”，举个简单的例子看看

 在child.vue中有如下代码

&lt;template&gt;

&lt;div&gt;

&lt;slot&gt;&lt;/slot&gt;

&lt;/div&gt;

&lt;/template&gt;



在App.vue中的代码如下：

&lt;template&gt;

&lt;...]]></description><category></category></item><item><title><![CDATA[前端面试需掌握的知识点]]></title><link>https://blog.youkuaiyun.com/Coloryi/article/details/89293806</link><guid>https://blog.youkuaiyun.com/Coloryi/article/details/89293806</guid><author>Coloryi</author><pubDate>Tue, 16 Apr 2019 23:58:03 +0800</pubDate><description><![CDATA[目录

1、原型链的理解

2、闭包

3、手写实现call、apply和bind

4、new的原理

5、深拷贝和浅拷贝

6、js继承

7、前端性能优化

    一、原型链的理解

        在谈原型链之前，我们需要掌握一些知识，如下所示：

        1、js对象分为普通对象和函数对象（object和Funct...]]></description><category></category></item><item><title><![CDATA[全方位说明从输入URL到页面展示的过程]]></title><link>https://blog.youkuaiyun.com/Coloryi/article/details/89258499</link><guid>https://blog.youkuaiyun.com/Coloryi/article/details/89258499</guid><author>Coloryi</author><pubDate>Fri, 12 Apr 2019 21:33:59 +0800</pubDate><description><![CDATA[大概的流程：

    第一部分是加载一个资源的过程：

   1、 浏览器根据DNS服务器得到域名的IP地址

   2、 向这个IP的机器发送http请求

   3、服务器收到、处理并返回http请求

   4、 浏览器的到返回的内容



   第二部分是浏览器渲染页面的过程

    5、 根据HTML结构生成DOM...]]></description><category></category></item><item><title><![CDATA[在未知宽高度的情况设置子元素垂直水平居中]]></title><link>https://blog.youkuaiyun.com/Coloryi/article/details/89256709</link><guid>https://blog.youkuaiyun.com/Coloryi/article/details/89256709</guid><author>Coloryi</author><pubDate>Fri, 12 Apr 2019 20:48:57 +0800</pubDate><description><![CDATA[效果图：



html代码：


&lt;div class="parent"&gt;
  &lt;div class="child"&gt;我是子元素&lt;/div&gt;
&lt;/div&gt;

解决方案

  在子元素未知宽高度的情况下：

使用flex布局


            .parent{
    			width:300px;
    			height: 30...]]></description><category></category></item><item><title><![CDATA[使用node模拟前端接口]]></title><link>https://blog.youkuaiyun.com/Coloryi/article/details/88761949</link><guid>https://blog.youkuaiyun.com/Coloryi/article/details/88761949</guid><author>Coloryi</author><pubDate>Sat, 23 Mar 2019 15:36:07 +0800</pubDate><description><![CDATA[data.json文件：


{
	"students": [
		{
			"id": "1",
			"name": "张小三",
			"age": 18
		}, {
			"id": 2,
			"name": "张三",
			"age": 18
		}, {
			"id": 3,
			"name": "张小",
			"age": 18
		}, {
			"id": 4,
		...]]></description><category></category></item><item><title><![CDATA[替换空格和从尾到头打印链表]]></title><link>https://blog.youkuaiyun.com/Coloryi/article/details/88322366</link><guid>https://blog.youkuaiyun.com/Coloryi/article/details/88322366</guid><author>Coloryi</author><pubDate>Thu, 07 Mar 2019 22:09:42 +0800</pubDate><description><![CDATA[function replaceSpace(str)
{
    
    return  str.replace(/\s/g,'%20')
}

输入一个链表，按链表值从尾到头的顺序返回一个ArrayList。

刷到这道题的时候，顺便复习了一下单链表，以下是单链表的代码


 //单链表
function SingLinkedList() {

	//定义节点函数,一个节点由数据域和指针域组...]]></description><category></category></item><item><title><![CDATA[二维数组中的查找]]></title><link>https://blog.youkuaiyun.com/Coloryi/article/details/88257783</link><guid>https://blog.youkuaiyun.com/Coloryi/article/details/88257783</guid><author>Coloryi</author><pubDate>Wed, 06 Mar 2019 21:46:34 +0800</pubDate><description><![CDATA[在一个二维数组中（每个一维数组的长度相同），每一行都按照从左到右递增的顺序排序，每一列都按照从上到下递增的顺序排序。请完成一个函数，输入这样的一个二维数组和一个整数，判断数组中是否含有该整数。



第一种解法：

 使用两个for循环去循环数组中的数


function Find(target, array){
for(var i=0;i&amp;lt;array.length;i++){
   ...]]></description><category></category></item><item><title><![CDATA[js实现常见的几种排序]]></title><link>https://blog.youkuaiyun.com/Coloryi/article/details/88082650</link><guid>https://blog.youkuaiyun.com/Coloryi/article/details/88082650</guid><author>Coloryi</author><pubDate>Sat, 02 Mar 2019 23:22:19 +0800</pubDate><description><![CDATA[//冒泡排序算法

function BubbleSort(array){
var n = array.length;
var temp;
for(var i=0;i&amp;lt;n-1;i++){
for(var...]]></description><category></category></item><item><title><![CDATA[事件处理程序]]></title><link>https://blog.youkuaiyun.com/Coloryi/article/details/88044111</link><guid>https://blog.youkuaiyun.com/Coloryi/article/details/88044111</guid><author>Coloryi</author><pubDate>Thu, 28 Feb 2019 20:25:12 +0800</pubDate><description><![CDATA[HTML事件处理程序：

在节点元素中直接添加事件，比如说：

&amp;lt;div onclick=&quot;alert('hello')&quot;&amp;gt;&amp;lt;/div&amp;gt;

或者&amp;lt;div onclick=&quot;show()&quot;&amp;gt;&amp;lt;/div&amp;gt;

&amp;lt;script&amp;gt;

function show(){

alert(&quot;hello&quot;);

}

&amp;l]]></description><category></category></item></channel></rss>