Vue 页面权限控制和登陆验证；Vue踩坑之旅（二）—— 监听页面刷新和关闭；一文彻底理解JavaScript的深拷贝与浅拷贝；Vue踩坑之旅（三）—— 修改子组件样式；WebSockets 与长轮询的较量；CSS 属性选择器的深入挖掘；React 新特性 Hooks 讲解及实例(二)；如何避免Puppeteer被前端JS检测
-
Vue 页面权限控制和登陆验证就是一个网站有不同的角色，比如管理员和普通用户，要求不同的角色能访问的页面是不一样的。如果一个页面，有角色越权访问，这时就得做出限制了。
-
Vue踩坑之旅（二）—— 监听页面刷新和关闭 我在做项目的时候，有一个需求，在离开（跳转或者关闭）购物车页面或者刷新购物车页面的时候向服务器提交一次购物车商品数量的变化。 将提交的一步操作放到 beforeDestroy 钩子函数中。 beforeDestroy() { console.log(‘销毁组件’） this.finalCart()},复制代码 但是发现 beforeDestroy 只能监听到页面间的…
-
一文彻底理解JavaScript的深拷贝与浅拷贝 javascript 中一般有 按值传递 和 按引用传递 两种复制方式: 按值传递的是 基本数据类型 （Number,String,Boolean,Null,Undefined），一般存放于内存中的栈区，存取速度快，存放量小； 按引用传递的是 引用类型 （Object,Array,Function,Symbol），一般存放与内存中的堆区，存取速度慢，存放量大，其引用指针存…
-
Vue踩坑之旅（三）—— 修改子组件样式 在vue组件中为 <style> 标签开启 scoped 属性，这样样式只作用于这个组件，而不会污染其他组件。 在项目中，我们经常要引入外部的 UI 组件（如 elementUI、mint-ui），但是在父组件中添加 scoped 属性后，父组件的样式将不会渗透到子组件中，所以在父组件中书写子组件的样式是无效果的。 下面有几种方法来…
-
WebSockets 与长轮询的较量 原文地址： WebSockets vs Long Polling 原文作者： Kieran Kilbride-Singh 译文出自： 掘金翻译计划 本文永久链接： github.com/xitu/gold-m… 译者：Jalan 校对者： linxiaowu66 、 sunui 我们要如何在两者之间做出选择？ 有时候，当信息一旦准备就绪，我们就需要从服务器…
-
CSS 属性选择器的深入挖掘属性选择器是在 CSS2 中引入的并且在 CSS3 中得到了很好拓展。本文将会比较全面的介绍属性选择器，尽可能的去挖掘这个选择器在不同场景下的不同用法。
-
React 新特性 Hooks 讲解及实例(二)Hook 是 React 16.8 的新增特性。它可以让你在不编写 类组件 的情况下使用 state 以及其他的 React 特性。
-
如何避免Puppeteer被前端JS检测这两天开始看puppeteer，发现居然也能被前端js检测出来！？github的issue区找了找，原来puppeteer启动的chrome里面，是有navigator.webdriver属性的，搞什么搞么，老外真是做那啥还要立牌坊Orzissue里也看到了解…
-
将webpack打包优化到极致_20180619 项目上线前是专门针对 webpack 打包做了优化的，但是在之后做网络优化的时候通过 webpack-bundle-analyzer 这个插件发现一些公共的js文件重复打包进了业务代码的js中。这些代码体积虽然很小，但是为了将优化做到极致还是想要将其优化一下。这个过程最大的收获就是让自己对 webpack4.x 相关配置项更加的熟悉，能够使用 we…
-
【进阶 6-5 期】 Throttle 和 Debounce 在 React 中的应用 本篇是译文，原文是 Improve Your React App Performance by Using Throttling and Debouncing 引言 使用 React 构建应用程序时，我们总是会遇到一些限制问题，比如大量的调用、异步网络请求和 DOM 更新等，我们可以使用 React 提供的功能来检查这些。 shouldComponentUpdate(…) 生命周期钩子 …
-
Webpack如何引入CDN链接来优化编译后的体积 背景 在 Vue 项目中，引入到工程中的所有 js 文件，编译时都会被打包进 vendor.js，也就导致了 vendor.js 文件体积变得相当臃肿，一定程度上影响着页面的渲染。为了减少编译后的体积，提高页面渲染速度，我们可以通过引入 CDN 链接把库分离，多线程异步 js 库，从而达到加速渲染的目的。那么我们如何做呢？ 步骤 1….
-
如何用js写一个斗地主 技术栈： * 前端：vue * 后端：nodejs+websocket+ws 复制代码 已实现功能： * 随机发牌（自动分配地主和地主牌） * 出牌同步 * 断线重连（依据ip。demo中为了方便演示，并没有限定一个ip只能加入一次） * 退出游戏（同房间其他玩家也会清除手牌） * 游戏大厅与多房间游戏 * log公告窗口 复制代码 基本功能的实现 we…
-
Babel 插件开发手册（官方） 这篇文档涵盖了如何创建Babel 插件等方面的内容。 这本手册提供了多种语言的版本，查看自述文件 里的完整列表。 目录 Babel 是一个通用的多功能的 JavaScript 编译器。此外它还拥有众多模块可用于不同形式的静态分析。 静态分析是在不需要执行代码的前提下对代码进行分析的处理过程 （执行代码的同时进行代码分析…
-
JavaScript展开操作符(Spread operator)介绍 本文介绍JavaScript的展开操作符(Spread operator) … 。本文适合ES6初学者。 你可以通过展开操作符(Spread operator) … 扩展一个数组对象和字符串。展开运算符（spread）是三个点（…）,可以将可迭代对象转为用逗号分隔的参数序列。如同rest参数的逆运算。 用于数组 以数组为例，首先创建一个数组， const…
-
webpack系列之输出文件分析 上一篇文章我们讲了如何使用 webpack ，执行打包会在 dist 生成一堆文件，那么 webpack 输出的文件里面到底长啥样呢？用过的人100%看过，大部分的还是压缩混淆后的代码，一般我们不会去关心它，只管当前持续运行正常就行了。今天我们来看看 webpack 输出的文件 配置 安装 > npm inin -y > cnpm …
-
【愣锤笔记】underscore源码里中高级前端所需要掌握的内容 underscore.js作为一个函数式库，也可以说是个工具库，在日常开发中可以显著的帮我们提示开发效率。当然了，同等的还有lodash等更为流行的库，但是这并不妨碍我们欣赏underscore.js的设计艺术，体验作者强大的代码抽象和函数复用功力。 代码更多的在于分享一些有用、但却容易被忽略的内容或设计逻辑。像一些已经烂大街…
-
一次项目中移除jQuery的实践 早期的项目为了降低兼容浏览器的成本使用了jQuery，在项目使用期间，也逐渐暴露了一些问题。由于我们是sdk项目，需要集成进公司其他部门的产品，所以对适配以及兼容性要求比较高。在应用过程中，就发生了与移动端三方库zepto变量$冲突的问题。当时为了解决这个问题，新建了一个变量提供给jQuery以避免冲突。后期有了充裕…
前端日报栏目数据来自码农头条，每日分享互联网上热门的前端开发、移动开发、设计、资源和资讯等，为开发者提供动力，如果觉得内容对你有用，记得分享给你的小伙伴。进入码农头条查看更多
