<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[weixin_45290022的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/weixin_45290022</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; weixin_45290022]]></copyright><item><title><![CDATA[微信小程序页面中如何监听手指滑动事件]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/116714025</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/116714025</guid><author>weixin_45290022</author><pubDate>Wed, 12 May 2021 17:04:52 +0800</pubDate><description><![CDATA[在开发中需要监听手指在页面的滑动事件来来实现操作需求，这里找到了一个解决方案虽然不知道是不是最佳但是满足了需求，所以分享给大家，希望在大家需要的时候能够起到作用，如有不足之处还望指出，谢谢！话不多说，直接展示实现过程（这里只展示主要代码段）
实现的思路：手指在屏幕上的滑动可以看作是手指在页面最外层盒子上的滑动
一、注册触摸开始事件、触摸移动事件、触摸结束事件
&lt;!--pages/weixinlink/weixinlink.wxml--&gt;
&lt;view class="container" bi]]></description><category></category></item><item><title><![CDATA[微信小程序自定义导航栏]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/116655331</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/116655331</guid><author>weixin_45290022</author><pubDate>Tue, 11 May 2021 15:32:52 +0800</pubDate><description><![CDATA[在小程序开发过程中难免会遇到小程序原有的导航不能满足项目中的需求，所以需要自己去自定义导航栏，接下来就和大家分享一下如何实现自定义导航栏，如果有不足之处，还望指出，谢谢！（接下来只提供主要的代码段）
一、更改小程序app.json配置文件
在小程序app.json的配置文件中的window属性中添加**navigationStyle：“custom”**
{
  "pages":[
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window":]]></description><category></category></item><item><title><![CDATA[webpack自动编译工具]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/113694480</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/113694480</guid><author>weixin_45290022</author><pubDate>Tue, 11 May 2021 14:41:58 +0800</pubDate><description><![CDATA[webpack中有几个不同的选项，可以在代码发生变化后自动编译代码：
1、watch
2、webpack-dev-server
3、webpack-dev-middleware
watch
用法1：在webpack指令后边加上--watch参数即可
作用：监视本地项目文件的变化，发现有修改的代码会自动编译打包，生成输出文件
具体操作步骤：
1、配置package.json的scripts中的"webpack --watch"
2、运行npm run watch
代码如下：
"scripts": {
    ]]></description><category></category></item><item><title><![CDATA[es6中export和export default的区别]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/113439544</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/113439544</guid><author>weixin_45290022</author><pubDate>Sat, 30 Jan 2021 16:39:53 +0800</pubDate><description><![CDATA[1.export与export default均可用于导出常量、函数、文件、模块等
2.你可以在其它文件或模块中通过import+(常量 | 函数 | 文件 | 模块)名的方式，将其导入，以便能够对其进行使用
3.在一个文件或模块中，export、import可以有多个，export default仅有一个
4.通过export方式导出，在导入时要加{ }，export default则不需要
注意： export default与普通的export不要同时使用，并且如果使用export default {]]></description><category></category></item><item><title><![CDATA[vue的路由模式]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/113248025</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/113248025</guid><author>weixin_45290022</author><pubDate>Wed, 27 Jan 2021 14:26:58 +0800</pubDate><description><![CDATA[hash模式：
在浏览器中符号“#”以及后边的字符称之为hash，用window.location.hash读取；hash虽然在URL中，但是不被包括在HTTP请求中；用来指导浏览器的动作，对服务端安全无用，hash不会重加载页面。
history模式：
history采用HTML5的新特性；提供了两个方：pushState()和replaceState()可以对浏览器的记录栈进行修改，以及popState事件的监听到状态改变。history 模式下，前端的 URL必须和实际向后端发起请求的URL一致，否则]]></description><category></category></item><item><title><![CDATA[Vue中组件生命周期调用顺序]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/113247878</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/113247878</guid><author>weixin_45290022</author><pubDate>Wed, 27 Jan 2021 14:23:51 +0800</pubDate><description><![CDATA[简单概括： 组件的调用顺序都是先父后子，渲染完成的顺序是先子后父。组件的销毁操作是先父后子，销毁完成的顺序是先子后父。
加载渲染过程
父beforeCreate-&gt;父created-&gt;父beforeMount-&gt;子beforeCreate-&gt;
子created-&gt;子beforeMount- &gt;子mounted-&gt;父mounted

子组件更新过程
父beforeUpdate-&gt;子beforeUpdate-&gt;子updated-&gt;父updated

父]]></description><category></category></item><item><title><![CDATA[Vue模板编译原理]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/113247767</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/113247767</guid><author>weixin_45290022</author><pubDate>Wed, 27 Jan 2021 14:19:24 +0800</pubDate><description><![CDATA[简单说： vue的编译过程就是将template转化成render函数的过程。
具体过程： 首先 解析模板，生成AST语法树（一种用JavaScript对象的形式描述的模板），使用大量的正则表达式对模板进行解析，遇到标签、文本的时候都会执行相应的钩子函数进行相关处理。由于Vue的数据是响应式的，但是其实在模板中并不是所有的数据都是响应式的，有一部分数据在首次渲染加载之后就不会发生改变，对应的DOM也不会发生改变，那么优化的过程就是深度遍历AST语法树，按照相关的条件对树节点进行标记，那些被标记的节点（静态节]]></description><category></category></item><item><title><![CDATA[对于MVVM的理解]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/113247555</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/113247555</guid><author>weixin_45290022</author><pubDate>Wed, 27 Jan 2021 14:14:22 +0800</pubDate><description><![CDATA[什么是MVVM
MVVM是Model-View-ViewModel的缩写。Model代表数据模型，也可以在Model中定义数据修改和操作的业务逻辑，View代表UI组件，它负责将数据模型转化成UI展现出来。ViewModel监听数据模型的改变和控制视图的行为、处理用户交互。
在MVVM框架中，View和Model之间并没有直接的联系，而是通过View Mode进行交互的，Model和ViewModel之间的交互是双向的，因此View数据的变化会同步的Model中，而Model数据的变化也会立即反映到View]]></description><category></category></item><item><title><![CDATA[Vue2.x组件通信有哪些方式]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/113247466</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/113247466</guid><author>weixin_45290022</author><pubDate>Wed, 27 Jan 2021 14:09:43 +0800</pubDate><description><![CDATA[父子组件通信：
父-&gt;子props，子-&gt;父 $on、$emit;
获取父子组件实例 $parent、$children;
通过Ref 获取实例的方式调用组件的属性或者方法;
Provide、inject 官方不推荐使用，但是写组件库时很常用

兄弟组件通信：
Vuex和Event Bus实现跨组件通信Vue.prototype.$bus = new Vue

跨级组件通信：
vuex,$attrs、$listeners, provide、inject


...]]></description><category></category></item><item><title><![CDATA[Computed和Watch的区别]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/113244054</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/113244054</guid><author>weixin_45290022</author><pubDate>Wed, 27 Jan 2021 11:18:17 +0800</pubDate><description><![CDATA[Computed： 本质是一个具备缓存的watcher，依赖的属性发生变化就会更新视图。适用于计算比较消耗性能的计算场景，当表达式过于复杂时，在模板中放入过多逻辑会让模板难以维护，可以复杂的逻辑放入计算属性中处理。
watch： 没有缓存性，更多的时观察作用，可以监听某些数据执行回调。使用时可以设置deep:true对对象中的每一项进行深度监听。但是这种方法会带来性能问题，可以通过字符串形式的监听。如果没有写到组件中，不要忘记使用unWatch手动注销。

...]]></description><category></category></item><item><title><![CDATA[vue3.x双向绑定原理]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/113243058</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/113243058</guid><author>weixin_45290022</author><pubDate>Wed, 27 Jan 2021 10:48:20 +0800</pubDate><description><![CDATA[实现原理
Vue3.x是通过proxy（代理）实现的数据的双向绑定。proxy跟Object.defineProperty一样也可以给对象的属性添加两个方法get&amp;set。
区别：Object.defineProperty一次性只能给对象的一个属性添加get&amp;set方法，而Proxy一次性给对象所有属性都设置get&amp;set方法
用法 ：创建一个新的proxy对象
let p  = new Proxy(obj,{get:function(){},set:function(){}})

]]></description><category></category></item><item><title><![CDATA[vue2.x中双向数据绑定实现的原理]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/113242586</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/113242586</guid><author>weixin_45290022</author><pubDate>Wed, 27 Jan 2021 10:40:19 +0800</pubDate><description><![CDATA[实现的原理
vue.js是采用数据劫持结合发布者-订阅者模式的方式，通过Object.defineProperty()来劫持各个属性的setter、getter，在数据发生变动时发布消息给订阅者，触发相应的监听回调。
具体的步骤
第一步：实现数据监听器observe，对数据进行递归遍历，包括子属性对象的属性，都相应的添加上getter、setter，这样在给某个属性赋值时都会触发setter，就能监听到数据的变化。
第二步：实现解析模板指令compile,将模板中的变量替换成数据，然后初始化渲染页面视图，并]]></description><category></category></item><item><title><![CDATA[vue的diff算法理解]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/113242060</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/113242060</guid><author>weixin_45290022</author><pubDate>Wed, 27 Jan 2021 10:12:09 +0800</pubDate><description><![CDATA[diff算法作用：
用来修改dom的一小段，不会引起dom树的重绘

diff算法实现的原理：
diff算法将virtual dom的某个节点数据改变后生成的新的vnode与旧节点进行比较，并替换为新的节点，具体过程就是调用patch方法，比较新旧节点，一边比较一边给真实的dom打补丁进行替换

具体过程详解：
1：在采用diff算法进行新旧节点进行比较的时候，比较是按照在同级进行比较的，不会进行跨级比较

2：当数据发生改变的时候，set方法会调用dep.notify通知所有的订阅者watcher，订阅者]]></description><category></category></item><item><title><![CDATA[http和https的区别]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/113025457</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/113025457</guid><author>weixin_45290022</author><pubDate>Sat, 23 Jan 2021 07:51:11 +0800</pubDate><description><![CDATA[Http：超文本传输协议（Http，HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络协议。设计Http最初的目的是为了提供一种发布和接收HTML页面的方法。它可以使浏览器更加高效。Http协议是以明文方式发送信息的，如果黑客截取了Web浏览器和服务器之间的传输报文，就可以直接获得其中的信息。
Https：是以安全为目标的Http通道，是Http的安全版。Https的安全基础是SSL。SSL协议位于TCP/IP协议与各种应用层协议之间，为数据通讯提供安全支持。SSL协议]]></description><category></category></item><item><title><![CDATA[ECMAScript6的常用的语法]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/112613966</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/112613966</guid><author>weixin_45290022</author><pubDate>Thu, 14 Jan 2021 15:55:11 +0800</pubDate><description><![CDATA[var(变量)、let(变量)和const(常量)的区别
var(变量)：
	1、存在变量提升问题，降低js代码的可阅读性 
	2、没有块级作用域，容易造成变量污染

let(变量)：
	1、不存在变量提升问题，只有定义之后才能使用此变量
	2、存在{}块级作用域
	3、let定义的变量不会挂载到window上面

const主要特性：
	1、不存在变量提升问题，只有定义之后才能使用此变量
	2、const定义的时常量，无法被重新赋值，如果时定义的是对象，则对象里面的值是可以被修改的
	3、当定义常量的时候]]></description><category></category></item><item><title><![CDATA[JQuery简介以及常用的方法]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/112562903</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/112562903</guid><author>weixin_45290022</author><pubDate>Wed, 13 Jan 2021 22:55:48 +0800</pubDate><description><![CDATA[简介：jquery是JavaScript框架库中的一种，写的少，做的多，链式编程，隐式迭代等。可以解决js的兼容性问题。
JQuery中常用的方法
1、获取对象的值和设置对象中的值
 1. $(对象).val();//获取对象中的值
 2. $(对象).html();//设置标签中间显示其他标签及内容,类似于innerHTML
 3. $(对象).text();//设置标签中间显示的文本内容，类似于innerText 
 4. $(对象).css();//设置元素的样式，类似于style  
    $(对]]></description><category></category></item><item><title><![CDATA[字符串(String)对象]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/112554312</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/112554312</guid><author>weixin_45290022</author><pubDate>Wed, 13 Jan 2021 10:06:55 +0800</pubDate><description><![CDATA[定义：String定义了一个字符串对象
字符串的不可变：字符串的不可变指的是里面的值不可变，表面看上去是可以改变，其实是地址改变了，新开辟了一个内存空间。正因为如此，在大量拼接字符串的时候会有效率问题。
字符串中常用的方法：
 1. indexOf('要查找的字符'，开始的位置)开始的位置是index索引号  返回指定的内容在原字符串中的位置，如果找不到就返回-1
 2. lastIndexOf()  从后往前找 只找第一个匹配的
 3. charAt(index) 返回指定位置的字符（index字符串的索]]></description><category></category></item><item><title><![CDATA[什么是数组以及数组常用的方法]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/112553491</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/112553491</guid><author>weixin_45290022</author><pubDate>Wed, 13 Jan 2021 09:52:40 +0800</pubDate><description><![CDATA[数组的定义：一组有序的数据
数组的本质：一组数据的集合，并且里面的数据是有序的
数组的作用：把一组相关的数据存放在一起，并提供方便的访问（获取）方式
数组的创建的方式：
 1. 通过new方式创建 语法：var 数组名 = new Aarray()
 2. 通过字面量的形式创建 语法：var 数组名 = [];  注意：字面量:源代码中一个固定值的表示方法

注意：数组中可以存放任意类型的数据
数组中的方法：
 3. instanceof: 判断一个对象是否属于某种类型
 4. Array.isArray(]]></description><category></category></item><item><title><![CDATA[什么是Ajax，如何发起请求？]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/112534866</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/112534866</guid><author>weixin_45290022</author><pubDate>Tue, 12 Jan 2021 17:00:30 +0800</pubDate><description><![CDATA[什么是Ajax
即 Asynchronous Javascript And XML，是一种通过在后台与服务器进行少量的数据交换，可以使页面实现异步更新，这就意味着可以在不重新加载整个网页的情况下，对页面的某一部分进行数据的更新。AJAX 不是一门的新的语言，而是对现有持术的综合利用。基于web标签的xhtml+css。
本质：是在HTTP协议的基础上以异步的方式通过XMLHttpRequest对象与服务器进行通信。
作用：可以在页面不刷新的情况下，请求服务器，局部更新页面的数据；可以使用dom进行动态的显示]]></description><category></category></item><item><title><![CDATA[如何防止在刷新时vuex中的数据被初始化]]></title><link>https://blog.youkuaiyun.com/weixin_45290022/article/details/110482296</link><guid>https://blog.youkuaiyun.com/weixin_45290022/article/details/110482296</guid><author>weixin_45290022</author><pubDate>Wed, 02 Dec 2020 15:09:52 +0800</pubDate><description><![CDATA[如何防止在浏览器刷新时vuex中的数据被初始化
vuex是在中大型项目中必不可少的状态管理组件，但是在使用的过程中会出现刷新会重新更新状态的问题，有时候会影响我们获取某些数据，例如全局相关的，如登录状态、token、以及一些不常更新的状态等，所以为了能后将不经常更新的数据固定化，减少接口的请求次数，这里推荐一种方法：使用vuex持久化来解决。
使用方法：
1、安装
npm i -S vuex-persistedstate

我自己安装的版本号
 "vuex-persistedstate": "^3.0.1"]]></description><category></category></item></channel></rss>