前端
关注
分享
扫一扫
Web全栈开发
Vue Vue.js React Angular javaScript ES6 js HTML5 H5 webpack (React Native)
HBuilder Mui jQuery (uni app) 微信小程序 mpvue APICloud element-ui (ant deisign)
CSS CSS3 Node.js WEB前端 Web全栈开发 Layui Egret flutter Taro ionic gulp
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
VUE.js组件通信精髓归纳（基础篇）
前言 文章涉及的内容可能不全面，但量很多，需要慢慢看。我花了很长的时间整理，用心分享心得，希望对大家有所帮助。但是难免会有打字的错误或理解的错误点，希望发现的可以邮箱告诉我1163675970@qq.com，我会及时的进行修改，只希望对你有所帮助，谢谢。 vue 何为组件化？ 我们可以很直观的将一个复杂的页面分割成若干个独立组件 每个组件包含自己的逻辑和样式再将这些独立组件组合完成一个复杂的页面。...原创 2019-10-15 16:30:44 · 331 阅读 · 0 评论 -
【Vue原理】Vue源码阅读总结大会 - 终
写文章不容易，点个赞呗兄弟 专注 Vue 源码分享，文章分为白话版和 源码版，白话版助于理解工作原理，源码版助于了解内部详情，让我们一起学习吧 研究基于 Vue版本 【2.5.17】 如果你觉得排版难看，请点击 下面链接 或者 拉到 下面关注公众号也可以吧 【Vue原理】Vue源码阅读总结大会 - 终 终于啊终于啊，把 Vue 系列的文章发完了了，如释重负的感jio啊，今天就打算总结下，我这段时间...原创 2019-10-15 16:30:07 · 324 阅读 · 0 评论 -
Vue 开发必须知道的 36 个技巧【近1W字】
前言 Vue 3.x 的Pre-Alpha 版本。后面应该还会有 Alpha、Beta 等版本,预计至少要等到 2020 年第一季度才有可能发布 3.0 正式版; 所以应该趁还没出来加紧打好 Vue2.x 的基础; Vue基本用法很容易上手,但是有很多优化的写法你就不一定知道了,本文从列举了 36 个 vue 开发技巧; 后续 Vue 3.x 出来后持续更新. 1.require.context(...原创 2019-10-15 16:29:25 · 412 阅读 · 0 评论 -
Vue 关于移动端的那些事情（一）
想法 最近公司项目可能会用到vue的技术，趁现在有时间，就开始搞移动端的适配，为了方便开发，我的想法是(viewport+rem+flex)。rem那块需要进行一个换算需要做一个适配处理，为了方便最好是根据规定的图(本文采用iPhone6)编写px，然后通过工具对px进行转换成rem(px2rem)。好了，需求已经理清了，开搞！！！。 行动 关于适配问题的解决方案 第一种适配方案 在网上查看资料，...原创 2019-10-15 16:28:33 · 368 阅读 · 0 评论 -
很好用的 UI 调试技巧
在业务开发过程中，想必大家经常会需要查看一个元素的位置及大小并修改它的 CSS，因此就会频繁使用到 DevTools 中的选择元素功能。 其实我们可以使用一个 CSS 技巧给所有元素加上 outline，这样就能迅速了解自己所需的元素位置信息，无须再选择元素查看了。 我们只需要添加以下 CSS 就能为任何网站添加这样的效果 html * { outline: 1px solid red } 复制代...原创 2019-09-23 16:05:55 · 282 阅读 · 0 评论 -
前端工程实践之可视化搭建系统
原创不易，希望能关注下我们，再顺手点个赞~~ 本文首发于政采云前端团队博客： 前端工程实践之可视化搭建系统（一） 背景 随公司业务不断发展，营销活动、广告、页面改版等需求日益倍增，靠纯人工撸代码已经无法跟上需求增长速度。加班？招人？显得不够明智，也不够前端，提效也就成为了关键。如何提效？从何入手？那不得不提的就是前端提效神器 —— 搭建系统，下文将从多个方面，向大家简单介绍政采云前端团队 ZooT...原创 2019-09-23 16:05:15 · 3751 阅读 · 0 评论 -
Dio 3.0发布，支持Flutter Web 和 Http/2.0
Flutter 一周前发布了1.9 版本，其中最大特性是将Flutter Web合入了主分支。而今天，Dio 也正式发布了3.0.0，该版本最大的特性是支持Flutter Web 和 Http/2.0。 升级提示：由于Dio 3.0需要支持Flutter Web，需要对代码进行较大的重构，所以并不能完全向下兼容，2.1版本用户可参考 3.0升级指南 。 支持Flutter Web 开发者只需要将F...原创 2019-09-23 16:07:31 · 1040 阅读 · 0 评论 -
手写算法并记住它：快速排序（5行代码简单版）
对于经典算法，你是否也遇到这样的情形：学时觉得很清楚，可过阵子就忘了？ 本系列文章就尝试解决这个问题。 研读那些排序算法，细品它们的名字，其实都很贴切。 比如快速排序，一个快字就能体现出其价值，因而它是用得最多的。 因为它相对难一些，本系列将分两篇文章讲解它。 本篇是一种简单实现版本，与归并排序做对比，摸清快排的总体思路。下一篇才是常见于各教程中的原地排序算法。 快速排序这个名字是针对其性能来起的...原创 2019-09-24 17:00:16 · 594 阅读 · 0 评论 -
前端基础知识概述 -- 移动端开发的屏幕、图像、字体与布局的兼容适配
本文是内部的一次分享沉淀，偏向基础但是涉及了一些有意思的细节，文笔有限，才疏学浅，文中若有不正之处，万望告知。 前端的一大工作内容就是去兼容页面在不同内核的浏览器，不同的设备，不同的分辨率下的行为，使页面的能正常工作在各种各样的宿主环境当中。 而本文的主题 – 移动端开发的兼容适配与性能优化，就是希望能从一些常见的移动端开发问题出发，厘清 Web 移动端开发的前前后后，一些技术的发展过程，一些问题...原创 2019-09-24 17:01:10 · 566 阅读 · 0 评论 -
零基础的前端开发初学者应如何系统地学习？
回想四年前我刚入行的时候，那时候很多人对于前端的看法是“切图，画页面，有个编辑器+浏览器就能干，门槛低”，现在已经完全不是那样了，可以说现在的前端这个职业的门槛虽然还是没怎么变，但是整个行业的门槛提升了，换句话说就是整个行业对于前端这个职位要求更高了，对于前端小白的需求量降低，对于高级前端的需求量还在上升，甚至是供小于求的局面。从市场经济学角度上讲你只有进入到高级级别，才能真正吃到行业的红利。 因...原创 2019-09-24 17:01:41 · 219 阅读 · 0 评论 -
这些Web API真的有用吗? 别问，问就是有用
本文列举了一些列比较不常见的Web API，内容较多，所以有关兼容性的内容在本文不会出现，大家可以自己去查阅。 以下案例能配动图的我尽量去配了，以免内容枯草乏味，但是如果内容有误，也请大家亲喷或者纠正???? 方法列表 querySelector（元素向下查询，返回一个） querySelectorAll（元素向下查询，返回多个） closest（元素向上查询） dataset（获取元素以"data-"...原创 2019-09-24 17:02:16 · 397 阅读 · 0 评论 -
vue项目整合Eslint和stylelint规范代码
前言 最近在搭建项目框架，想着上一个项目代码风格各异，就想着在新项目中引入Eslint来规范团队成员代码风格，保持统一，也方便大家维护代码，减少不必要的错误。前端应用愈加复杂，代码规范问题必须通过强制的方式保持统一。以下是团队逐渐摸索出的一些配置，各取所需。 Eslint配置 在用vue-cli3搭建项目的过程中就会问你是否需要Eslint，选择就好来。如果没有选择后期又想加入eslint，可以手...原创 2019-09-25 15:48:55 · 1885 阅读 · 0 评论 -
你要的Vue面试题都在这里。
Vue.js介绍 Vue.js是一个轻巧、高性能、可组件化的MVVM库，同时拥有非常容易上手的API； Vue.js是一个构建数据驱动的Web界面的库。 Vue.js是一套构建用户界面的 渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。Vue的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，Vue 完全有能力驱动采用单文件组件和 Vue生...原创 2019-09-25 15:49:39 · 296 阅读 · 0 评论 -
富文本原理了解一下？
缘起 最近产品想让我在富文本里加个旋转图片的功能，我一想????，就觉得事情并不简单，因为印象中好像没见过这种操作。果然，经过一番百度之后，确实没怎么看到相关信息，这也就意味着要自己动手丰衣足食了????。但我自己对富文本又没什么了解，所以顺带稍微看了下富文本的实现方式，特此来沉淀一下，还是那句话不喜勿喷哈????。 ok，这里先简要说下为什么会有富文本这种东西吧????！大概可能也许是因为有一天产品用着用着 texta...原创 2019-09-25 15:50:16 · 374 阅读 · 0 评论 -
[手把手系列之]Docker 部署 vue 项目
Docker 部署 vue 项目 1.写在前面： Docker 作为轻量级虚拟化技术，拥有持续集成、版本控制、可移植性、隔离性和安全性等优势。本文使用Docker来部署一个vue的前端应用，并尽可能详尽的介绍了实现思路和具体步骤，以方便有类似需要的同学参考。 Docker 是一个开源的应用容器引擎，让开发者可以打包他们的应用以及依赖包到一个可移植的容器中，该容器包含了应用程序的代码、运行环境、依赖...原创 2019-09-25 15:51:08 · 1487 阅读 · 0 评论 -
基于Vue CLI3 搭建五脏俱全的移动端H5应用
前言 之前开发vue项目，一直是自己搭建脚手架，并没有使用配套的Vue-CLI。一、是3.0之前的CLI无明显优势，配置繁琐；二、是觉得自己从零配置项目可控性更强。 Vue-CLI 3.0 于去年8月份就已发布，却一直没去了解。近日，有新Vue H5项目开发，就想着用Vue CLI3.0脚手架构建项目。并记录一下构建使用过程。 使用脚手架最好的参考就是官方文档，官方文档整体还是比较清晰明了的，更新...原创 2019-09-26 16:40:55 · 2041 阅读 · 0 评论 -
这几天国外关于 Vue 新 API 的一些争论
本文只是翻译 ???? 掘金的排版比知乎好太多了。 首先是 Reddit 上有人发帖。 标题：Vue 3 将大变——目前的语法会被弃用，组合函数将最终作为创建组件的唯一方式 内容： 尤雨溪几天前发布了一篇 RFC（意见征求稿），介绍了 Vue 3 里基于函数的 API。 许多我们正在使用的特性都会被弃用，诸如 data、computed、methods、watch、mixin、extends 和生命周期...原创 2019-09-26 16:41:48 · 271 阅读 · 0 评论 -
Vue项目优化方案
经过对项目结构 / 开发方式 / 技术架构的研究，再次提出部分可以优化的点。 刚加入新公司之后，在学习来新公司的开发技术之后，就迫不及待的想要将自己过往的开发方式和技巧融合到现在的项目中，下面是针对目前项目的中一些技术点的改进思路 此方案主要由如下几点组成： 代码编写规范 Api层抽离 Request工具更高效封装 路由分离配置方案 目录结构整理 数据请求优化 Mock数据配置 方案在不断的编写过...原创 2019-09-26 16:42:23 · 716 阅读 · 0 评论 -
Vue 实现前端权限控制
登录&&权限流程图 前言 首先我们确定的权限控制分为三大部分，其中根据粒度大小分的更细： 登录权限控制 页面权限控制 菜单中的页面是否可以被访问 页面中的按钮 (增、删、改、查)的权限控制是否显示 接口权限控制 一、登录权限控制 登录访问权限控制是对用户的校验。在用户登录成功之后，后台将返回一个token，之后前端每次进行接口请求的时候，都要带上这个token。后台拿到这个toke...原创 2019-09-26 16:42:59 · 477 阅读 · 0 评论 -
这可能是你见过的最便捷的Vue i18n Vscode插件
契子 vue项目国际化非常的繁琐: 将所有出现的要国际化的汉字复制取名配置 在vue/js文件中找到汉字位置，区分是在template中标签的label或者其他property中，或者{{}}中script，又或者script中的，手动将一层一层的国际化key拷贝，粘贴。 就算是相同的汉子，由于在vue中的语法不同，需要重复的拷贝，粘贴 碰到一堆汉字拼接的简直要了老命/(ㄒoㄒ)/~~ 快速开始 ...原创 2019-09-27 14:47:41 · 2683 阅读 · 0 评论 -
近两万字小程序攻略发布了
该内容由银科控股融汇研发部曹俊及其团队授权提供。该团队拥有 10 多名小程序开发，深耕小程序领域，总结出了本篇优质长文。同时本篇内容也已经合并入我的 开源项目 中，目前项目内容包含了 JS、网络、浏览器相关、性能优化、安全、框架、Git、数据结构、算法等内容，无论是基础还是进阶，亦或是源码解读，你都能在本图谱中得到满意的答案，希望这个面试图谱能够帮助到大家更好的准备面试。 小程序-登录 union...原创 2019-09-29 15:36:31 · 519 阅读 · 0 评论 -
Vue生命周期详解
文章目录 一. Vue生命周期介绍 **生命周期的含义：**从Vue实例创建，运行，到销毁期间，总是伴随着各种各样的事件，这些时间统称为生命周期 **常见叫法：**生命周期钩子 == 生命周期函数 == 生命周期事件 1.1 生命周期分类 下面，将从这三个阶段，依次来学习Vue的生命周期 1.2 创建阶段 beforeCreate：实例刚在内存中创建出来，还没有初始化 data和 methods，...原创 2019-09-29 15:37:03 · 200 阅读 · 0 评论 -
「数据可视化库王者」D3.js 极速上手到Vue应用
前言 D3近年来一直是JavaScript最重要的数据可视化库之一，在创建者Mike Bostock的维护下，前景依然无量，至少现在没有能打的: D3与众多其他库的区别在于无限定制的能力（直接操作SVG）。 它的底层API提供对原生SVG元素的直接控制，但它也带来了高学习曲线的成本。 我们将把D3和Vue结合在一起 - 使用Vue的动态数据绑定，清晰的语法和模块化结构，可以充分发挥D3的最佳性能。...原创 2019-09-29 15:37:57 · 614 阅读 · 0 评论 -
Vue 使用中的小技巧
在vue的使用过程中会遇到各种场景，当普通使用时觉得没什么，但是或许优化一下可以更高效更优美的进行开发。下面有一些我在日常开发的时候用到的小技巧，在下将不定期更新~ 感兴趣的同学可以加文末的微信群，一起讨论吧～ 多图表resize事件去中心化 1.1 一般情况 有时候我们会遇到这样的场景，一个组件中有几个图表，在浏览器resize的时候我们希望图表也进行resize，因此我们会在父容器组件中写：...原创 2019-09-18 16:11:28 · 167 阅读 · 0 评论 -
「译」理解Javascript函数执行—调用栈、事件循环、任务等
现如今，web开发者（我们更喜欢被叫做前端工程师）用一门脚本语言就能做任何事情，从提供浏览器中的交互，到开发电脑游戏、桌面工具、跨平台移动应用，甚至可以在服务端部署（如最流行的Node.js）来连结任意数据库。因此，了解Javascript的内部构造很重要，这样才能更优更高效的使用它。这也是本文的主旨所在。 Javascript的生态正在变得越来越复杂。要构建一个现代web应用，会不可避免的用到W...原创 2019-08-29 14:47:44 · 225 阅读 · 0 评论 -
浏览器重绘(repaint)重排(reflow)与优化[浏览器机制]
很多人都知道要减少浏览器的重排和重绘，但对其中的具体原理以及如何具体操作并不是很了解，当突然提起这个话题的时候，还是会一脸懵逼。希望大家可以耐着性子阅读本文，仔细琢磨，彻底掌握这个知识点！ 博客、前端积累文档、公众号、GitHub 网页生成过程： HTML被HTML解析器解析成DOM 树 css则被css解析器解析成CSSOM 树 结合DOM树和CSSOM树，生成一棵渲染树(Render Tree...原创 2019-09-12 15:27:20 · 210 阅读 · 0 评论 -
[React技术内幕] setState的秘密
对于大多数的React开发者，setState可能是最常用的API之一。React作为View层，通过改变data从而引发UI的更新。React不像Vue这种MVVM库，直接修改data并不能视图的改变，更新状态(state)的过程必须使用setState。 setState介绍 setState的函数签名如下: setState(partialState,callback)复制代码 我们看到...原创 2019-09-12 15:29:37 · 241 阅读 · 0 评论 -
面试分享：两年工作经验成功面试阿里P6总结
前言 本文主要给大家带来一些我面试的经历和经验，希望对正在求职的同学有所帮助。我先大致说下面试之前的个人情况：2017年7月正式入职海康威视数字技术股份有限公司，使用Vue.js技术栈。 我写的篇幅可能有点长，如果只想看成功的面试请直接从阿里企业智能事业部（一面）开始，大家见谅哈。 这里推荐阅读之前写的文章（前面两篇实用型，后面两篇对面试应该会有帮助）： Vue CLI 3结合Lerna进行UI框...原创 2019-09-12 15:31:08 · 6319 阅读 · 1 评论 -
一个合格(优秀)的前端都应该阅读这些文章
前言 原文地址：Nealyang/PersonalBlog 的确，有些标题党了。起因是微信群里，有哥们问我，你是怎么学习前端的呢？能不能共享一下学习方法。一句话也挺触动我的，我真的不算是什么大佬，对于学习前端知识，我也不能说是掌握了什么捷径。当然，我个人的学习方法这篇文章已经在写了，预计这周末会在我个人公众号发布。而在此之前，我想展(gong)示(xiang)一下，我平时浏览各个技术网站，所记录下...原创 2019-09-12 15:32:25 · 354 阅读 · 0 评论 -
你或许不知道Vue的这些小技巧
前言 用Vue开发一个网页并不难，但是也经常会遇到一些问题，其实大部分的问题都在文档中有所提及，再不然我们通过谷歌也能成功搜索到问题的答案，为了帮助小伙伴们提前踩坑，在遇到问题的时候，心里大概有个谱知道该如何去解决问题。这篇文章是将自己知道的一些小技巧，结合查阅资料整理成的一篇文章，如果喜欢的话可以点波赞/关注，支持一下，希望大家看完本文可以有所收获。 前端进阶积累、公众号、GitHub 文章内容...原创 2019-09-16 15:21:03 · 141 阅读 · 0 评论 -
你要的 React 面试知识点，都在这了
摘要： 问题很详细，插图很好看。 原文：你要的 React 面试知识点，都在这了 作者：前端小智 Fundebug经授权转载，版权归原作者所有。 React是流行的javascript框架之一，在2019年及以后将会更加流行。React于2013年首次发布，多年来广受欢迎。它是一个声明性的、基于组件的、用于构建用户界面的高效javascript库。 以下是面试前必须了解的话题。 什么是声明式编程 ...原创 2019-09-16 15:23:17 · 271 阅读 · 0 评论 -
webpack4 的30个步骤打造优化到极致的 react 开发环境，如约而至
这一篇文章将react和webpack4进行结合,集webpack的优势于一身,从0开始构建一个强大的react开发环境 本篇所有代码线上代码react-webpack4-cook,翻译过来叫：webpack4和react的乱炖，可以跟着代码进行配置，之前有很多坑，线上代码都已经被解决了 。如果对您有帮助，不妨给个star.点赞关注不迷路 前言 一篇文章不写前言总感觉不太正式，大概介绍下我是怎么完...原创 2019-09-16 15:25:01 · 237 阅读 · 0 评论 -
如何写出一个惊艳面试官的深拷贝?
导读 最近经常看到很多JavaScript手写代码的文章总结，里面提供了很多JavaScript Api的手写实现。 里面的题目实现大多类似，而且说实话很多代码在我看来是非常简陋的，如果我作为面试官，看到这样的代码，在我心里是不会合格的，本篇文章我拿最简单的深拷贝来讲一讲。 看本文之前先问自己三个问题： 你真的理解什么是深拷贝吗？ 在面试官眼里，什么样的深拷贝才算合格？ 什么样的深拷贝能让面试官感...原创 2019-09-16 15:26:39 · 338 阅读 · 0 评论 -
从基础到实战 手摸手带你掌握新版Webpack4.0详解 一起读文档
项目地址 github.com/wudiufo/Web… 知识点概览： Loader，HMR ,Create React App, Caching, Plugin, SourceMap,Vue Cli 3.0 ,Shimming, WebpackDevServer,TreeShaking, CodeSplitting, Babel, React , Library, Eslint ,PWA, Vu...原创 2019-09-17 16:22:35 · 1075 阅读 · 0 评论 -
2018前端面试总结，看完弄懂，工资少说加3K | 掘金技术征文
前言 文章涉及的内容可能不全面，但量很多，需要慢慢看。来源于各个地方，我花了很长的时间整理，希望对大家有帮助。但是难免会有打字的错误或理解的错误，希望发现的可以邮箱告诉我236490794@qq.com，我会及时的进行修改，旨在能帮到大家，谢谢。 前端目录 HTML相关 CSS相关 JAVASCRIPT相关 DOM相关 HTTP相关 VUE相关 算法相关 网络安全相关 webpack相关 其他 H...原创 2019-09-17 16:23:58 · 269 阅读 · 0 评论 -
嘿，不要给 async 函数写那么多 try/catch 了
前言 在开发中，你是否会为了系统健壮性，亦或者是为了捕获异步的错误，而频繁的在 async 函数中写 try/catch 的逻辑？ async function func() { try { let res = await asyncFunc() } catch (e) { //… } } 复制代码 曾经我在《一个合格的中级前端工程师必须要掌握的 28 个 JavaScript 技巧》中提到过一个...原创 2019-09-17 16:25:57 · 267 阅读 · 0 评论 -
「前端词典」这些功能其实不需要 JS，CSS 就能搞定
直接入题 1. 每个单词的首字母大写 其实我第一次看到这个功能的时候就是使用 JS 去实现这个功能，想都没想 CSS 可以完成这个功能。马上就屁颠屁颠的写了一个方法： ``` function capitalizeFirst( str ) { let result = ''; result = str.toLowerCase().replace(/( |^)[a-z]/g, (L) =>...原创 2019-08-29 14:46:25 · 238 阅读 · 0 评论 -
Vue nextTick 机制
背景 我们先来看一段Vue的执行代码： export default { data () { return { msg: 0 } }, mounted () { this.msg = 1 this.msg = 2 this.msg = 3 }, watch: { msg () { console.log(this.msg) } } } 复制代码 这段脚本执行我们猜测会依次打印：1、2、3。但是实际...原创 2019-09-18 16:12:19 · 244 阅读 · 0 评论 -
7个有用的Vue开发技巧
1 状态共享 随着组件的细化，就会遇到多组件状态共享的情况，Vuex当然可以解决这类问题，不过就像Vuex官方文档所说的，如果应用不够大，为避免代码繁琐冗余，最好不要使用它，今天我们介绍的是vue.js 2.6新增加的Observable API ，通过使用这个api我们可以应对一些简单的跨组件数据状态共享的情况。 如下这个例子，我们将在组件外创建一个store，然后在App.vue组件里面使用s...原创 2019-09-18 16:13:03 · 156 阅读 · 0 评论 -
vue-cli3 从搭建到优化
前言 github地址： github.com/LeeStaySmal… (完整分支：optimize分支) demo地址： vue-project-demo.eloco.cn 安装与初始化架构 安装 node >= 8.9 推荐：8.11.0 + 安装：npm install -g @vue/cli 检查：vue --version 如果已安装旧版本，需要先npm uninstall vu...原创 2019-09-18 16:14:27 · 486 阅读 · 0 评论