摘要: 写在前面 最新 vue-next 的源码发布了,虽然是 pre-alpha 版本,但这时候其实是阅读源码的比较好的时机。在 vue 中,比较重要的东西当然要数它的响应式系统,在之前的版本中,已经有若干篇文章对它的响应式原理和实现进行了介绍,这里就不赘述了。在 vue-next 中,其实现原理和之前还 阅读全文
posted @ 2020-12-11 14:33 陌路y 阅读(368) 评论(0) 推荐(0) 编辑
摘要: 小程序到底是什么? 顾名思义,「小程序」本质上与我们平常经常使用的 app 和操作系统一样,都是一段电脑程序。你可以将小程序理解为「运行在微信上的 app」。 与普通的 app 不同的是,小程序的语言使用网页前端的技术栈,并且使用 JavaScript 运行环境,相当于是一个浏览器。 但是,小程序也 阅读全文
posted @ 2020-12-11 14:32 陌路y 阅读(406) 评论(0) 推荐(0) 编辑
摘要: 大约 5 年前开始我就不再用 js 框架了,最近 Jon Udell 问我近况如何: 译文:4 年前 bitworking 提议:”别再用 js 框架了,转向可复用、可正交组合的 html+css+JS 单元吧。“我很好奇这些年你在这方面积累了哪些经验,有了哪些想法和实践呢? 这几年我零零碎碎写过一 阅读全文
posted @ 2020-12-11 14:30 陌路y 阅读(359) 评论(0) 推荐(0) 编辑
摘要: 写在前面 使用 react hook 来做公司的新项目有一段时间了,大大小小的坑踩了不少。由于是公司项目,因此必须要编写单元测试来确保业务逻辑的正确性以及重构时代码的可维护性与稳定性,之前的项目使用的是 react@15.x 的版本,使用 enzyme 配合 jest 来做单元测试毫无压力,但新项目 阅读全文
posted @ 2020-12-11 14:27 陌路y 阅读(779) 评论(0) 推荐(0) 编辑
摘要: webpack打包工具成为了前端开发中必备工具,曾经一度的面试题都是问,请问前端页面优化的方式有哪些?大家也是能够信手拈来的说出缓存、压缩文件、css雪碧图以及部署CDN等等各种方法,但是今天不一样了,可能你去面试问的就是,请问你是否知道webpack的打包原理,webpack的打包优化方法有哪些? 阅读全文
posted @ 2020-12-11 14:23 陌路y 阅读(2387) 评论(0) 推荐(0) 编辑
摘要: 一、react更新的方式有三种: (1)reactDOM.render() || hydrate(ReactDOMServer渲染)(2)setState(3)forceUpdate 接下来,我们就来看下ReactDOM.render()源码 二、ReactDOM.render(element, c 阅读全文
posted @ 2020-12-11 14:21 陌路y 阅读(1210) 评论(0) 推荐(0) 编辑
摘要: 如题,在项目中,经常有些函数和变量是需要复用,比如说网站服务器地址,从后台拿到的:用户的登录token,用户的地址信息等,这时候就需要设置一波全局变量和全局函数 定义全局变量 原理: 设置一个专用的的全局变量模块文件,模块里面定义一些变量初始状态,用export default 暴露出去,在main 阅读全文
posted @ 2020-12-11 14:19 陌路y 阅读(1166) 评论(0) 推荐(0) 编辑
摘要: 在日常的vue项目开发中,随着业务的日渐负责,代码量的日益增加,随之带来的问题就是打包后的vendor.js体积过大,导致加载时空白页时间过长,给用户的体验太差。为此我们需要减少vendor.js的体积,从本质上来解决这种问题。 这里大概例举几个在项目中实际用到过的方法,优化后的js大概缩小了50% 阅读全文
posted @ 2020-12-11 14:18 陌路y 阅读(93) 评论(0) 推荐(0) 编辑
摘要: 前言 博客作为一个记录与分享工具是十分必要的,当前各大博客网站CSDN、简书、掘金等每天都有大量的分享文章出来,当然我们可以把文章分享到这些平台,不过我认为拥有一个可控的、定制的个人博客网站才是一个更酷的事情,而vuepress是当前非常火热的博客搭建框架。 vuepress1.0 到目前已经发布了 阅读全文
posted @ 2020-12-11 14:16 陌路y 阅读(1953) 评论(0) 推荐(0) 编辑
摘要: 随着项目的不断变大,可能有些人会把插件的引入和全局组件的注册都放到main.js中,导致后面main.js里面一大坨引入代码,看起来杂乱无比,也不利于后期进行维护,所以我们尽可能的让main.js看起来整洁些。此处就用到webpack的require.context功能,实现vue自动注册全局组件及 阅读全文
posted @ 2020-12-11 14:15 陌路y 阅读(796) 评论(0) 推荐(0) 编辑
摘要: 一.自定义指令directive 除了核心功能默认内置的指令 (v-model 和 v-show),vue 也允许注册自定义指令。注意,在 vue2.0 中,代码复用和抽象的主要形式是组件。然而,有的情况下,你仍然需要对普通 DOM 元素进行底层操作,这时候就会用到自定义指令。 来个实例,当页面加载 阅读全文
posted @ 2020-12-11 14:11 陌路y 阅读(375) 评论(0) 推荐(0) 编辑
摘要: 一、创建一个vue应用 new vue({ data() { return { name: 'yjh', }; }, router, store, render: h => h(App), }).$mount('#app'); 二、实例化一个Vue应用到底发生了什么? this._init() ca 阅读全文
posted @ 2020-12-11 14:07 陌路y 阅读(161) 评论(0) 推荐(0) 编辑
摘要: 对大部分人来说,掌握Vue.js基本的几个API后就已经能够正常地开发前端网站。但如果你想更加高效地使用Vue来开发,成为Vue.js大师,那下面我要传授的这五招你一定得认真学习一下了。 第一招:化繁为简的Watchers 场景还原: created(){ this.fetchPostList() 阅读全文
posted @ 2020-12-11 14:05 陌路y 阅读(97) 评论(0) 推荐(0) 编辑
摘要: 动态参数 可以用方括号括起来的 JavaScript 表达式作为一个指令的参数: <a v-bind:[attributeName]="url"> ... </a> 动态参数预期会求出一个字符串,异常情况下值为 null。这个特殊的 null 值可以被显性地用于移除绑定。任何其它非字符串类型的值都将 阅读全文
posted @ 2020-12-11 14:02 陌路y 阅读(352) 评论(0) 推荐(0) 编辑
摘要: 对于 setState() 相信伙伴们都用过,它是 react 官方推荐用来更新组件 state 的 API,但是对于 setState() 你真的了解吗?且待我慢慢详聊一番。 setState() 官方用法指南 语法1: setState(updater[, callback]) updater: 阅读全文
posted @ 2020-12-11 14:01 陌路y 阅读(1092) 评论(0) 推荐(0) 编辑