随笔分类 - WEB前端
摘要：在虚拟dom中diff的实现。 分别从3个方面： DIFF抽象概念（概述、时间复杂性分析、对比总结） 在Vue2中的实现（版本2.6.11、必要性、执行方式） 在React中的实现（版本16.13.1，必要性、执行方式） 3. 在React中的实现 react版本16.13.1 必要性分析 调用 R
阅读全文
摘要：在虚拟dom中diff的实现。 分别从3个方面： DIFF抽象概念（概述、时间复杂性分析、对比总结） 在Vue2中的实现（版本2.6.11、必要性、执行方式） 在React中的实现（版本16.13.1，必要性、执行方式） 1. DIFF抽象概念 diff是广泛的概念，如git diff，js对象 d
阅读全文
摘要：项目类一：中后台管理系统类 中后台系统类多为内部人员使用。采用Vue+elementUI开发。 技术选型的理由有以下几点： 一般的中后台管理系统实现的功能有以下几类： 模块化开发 模块化开发可以解决命名冲突、文件依赖的问题，方便多人协作开发，提升开发效率，方便后期维护。 权限控制 请求权限的实现 动
阅读全文
摘要：输入网址回车或者刷新页面到页面传染出来的整个流程 DNS 解析 HTTP三次握手 -> TCP/IP连接 浏览器发送请求 服务器返回请求的文件 (html) 浏览器渲染 1. DNS 解析 查找缓存 Chrome搜索自身的DNS缓存，看有没有该域名对应的IP地址（chrome://net-inter
阅读全文
摘要：安全类 CSRF、XSS CSRF 基本概念和缩写：跨站请求伪造（Cross-site request forgery） 攻击原理：接口存在漏洞、确实登陆过。 防御措施：Token验证、Referer（页面来源）验证、隐藏令牌。 攻击原理：用户为网站A的注册用户，通过登录，在浏览器中存储cookie
阅读全文
摘要：跨域通信的几种方式 JSONP Hash（hash改变，页面不刷新） postMessage（hmtl5中新增加的，用来实现跨域） WebSocket（不受同源限制） CORS（支持跨域通信的AJAX，浏览器会拦截AJAX请求，如果是跨域的，在HTTP头中加一个origin） JSONP jsonp
阅读全文
摘要：Vue 源码解析 Vue 的工作机制 在 new vue() 之后，Vue 会调用进行初始化，会初始化生命周期、事件、props、methods、data、computed和watch等。其中最重要的是通过Object.defineProperty设置setter和getter，用来实现响应式和依赖
阅读全文
摘要：缓存 每个微信小程序都可以有自己的本地缓存，可以通过 wx.setStorage/wx.setStorageSync、wx.getStorage/wx.getStorageSync、wx.clearStorage/wx.clearStorageSync，wx.removeStorage/wx.rem
阅读全文
摘要：页面跳转 小程序页面间跳转 保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到原页面。 跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面 小程序跳转H5 小程序有一个web-view的组件，是一个可以用来承载网页的
阅读全文
摘要：节点操作 不能使用window.document对象，所以无法操作Dom，操作节点可以使用wx.createSelectorQuery() SelectorQuery wx.createSelectorQuery() 返回一个 SelectorQuery 对象实例。 在自定义组件或包含自定义组件的页
阅读全文
摘要：wxs使用 WXS（WeiXin Script）是小程序的一套脚本语言，结合WXML，可以构建出页面的结构。 wxs可以说就是为了满足能在页面中使用js存在的，在wxml页面中，只能在插值{{ }}中写简单的js表达式，而不能调用方法，例如想获得某个时间的年份。 虽然也可以在page的data对象中
阅读全文
摘要：component使用 组件模板 组件模板的写法与页面模板相同。组件模板与组件数据结合后生成的节点树，将被插入到组件的引用位置上。 在组件模板中可以提供一个 <slot> 节点，用于承载组件引用时提供的子节点。 注意，在模板中引用到的自定义组件及其对应的节点名需要在 json 文件中显式定义，否则会
阅读全文
摘要：事件 数据绑定部分讲了，对象状态发生变化，通知页面更新视图元素的单向数据流向。 一旦用户操作或者数据更新引起数据变化，视图需要同步更新。就需要用到事件传递了。视图上的数据都必须用过事件传递给对象，只有用户操作视图，才能获取到数据，并更新对象状态。调用this.setData（）方法实现视图的部分渲染
阅读全文
摘要：【原文：数据绑定】 微信小程序是通过状态模式-单向数据流的方式来实现数据绑定的。 对象状态化，只要对象状态发送变化，就通知页面更新视图元素。 通过以下三个步骤实现： 识别哪个UI元素被绑定了相应的对象。 监视对象状态的变化。 将所有变化传播到绑定的视图上。 数据流向是单向的，视图变化不会影响对象状态
阅读全文
摘要：【原文：请求与封装】 微信小程序进行网络通信，只能和指定的域名进行通信，微信小程序包括四种类型的网络请求。 这里主要对普通HTTPS请求做一次详细介绍。 普通HTTPS请求 要微信小程序进行网络通信，必须先设置域名，不然会提示不合法。设置域名的信息可以在开发者工具-详情-域名信息中看到。 使用wx
阅读全文
摘要：【查看原文】 小程序分为应用、页面和组件三个部分，所以小程序的生命周期涉及以下： 应用的生命周期 页面的生命周期 组件的声明周期 应用的生命周期对页面生命周期的影响 （1）应用的生命周期 App() 函数用来注册一个小程序。接受一个 Object 参数，其指定小程序的生命周期回调等。App() 必须
阅读全文
摘要：【查看原文】 小程序的文件结构由三个文件和文件夹组成，放在根目录（即最外层目录）下的三个文件，分别是： app.js 小程序逻辑,决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。 app.json 小程序公共设置 app.wxss 小程序公共样式表 而在根目录的文件夹内，则是由文
阅读全文
摘要：【查看原文】 最近一段时间电商做小程序，需要适配E卡红包项目，于是也接触了一些小程序的开发。 文档中，对项目中使用到的小程序知识做一个使用的总结，同时也是完成项目以后做的一个回顾，对其中用到的知识点做一个简略罗列，帮助更好的理解小程序项目的内容。 今天所讲内容特点： 比较有针对性，都是开发时用到的频
阅读全文
摘要：【问题】：在测试环境中，微信分享分享给好友的链接是当前页面的链接，期望为接口返回的特定链接。 【解决】： 在测试反馈给我这个问题的时候，我先去正式环境看了一下，没有这个问题。 回想了一下近期代码的更改，也没有涉及到相关的更改。 得出初步结论：可能是测试环境配置的问题，造成分享不正确。不过虽然大概率是
阅读全文
摘要：【原文：Tapable 0.2.8 入门】 tapable是webpack的核心框架（4.0以上版本的API已经发生了变化），是一个基于事件流的框架，或者叫做发布订阅模式，或观察者模式，webpack的整个生命周期及其开放的自定义插件系统都离不开tapable的支持，研究其运行原理是阅读webpac
阅读全文