5 天前 / 冷星1024
写在前面这道题目是面试中相当高频的一道题目了，但凡你简历上有写：“熟练使用 Vue 并阅读过其部分源码”，那么这道题目十有八九面试官都会去问你。 “什么？你简历上不写阅读过源码，那面试官也很有可能会问你是否阅读过响应式相关的源码 还是那句歌词唱的： 挣不脱逃不过 眉头解不开的结 命中解不开的劫 整体流程作为一个前端的 MVVM 框架，Vue 的基本思路和 Angular、React 并无二致，其核心就在于： 当数据变化时，自动去刷新页面 DOM，这使得我们能从繁琐的 DOM 操作中解放出来，从而专心地去处理业务逻辑。
12 天前 / Dunizb
什么是 AnimXYZ？ AnimXYZ 是一个 CSS 动画库，用于为你的网站创建自定义 CSS 动画。是什么让 AnimXYZ 如此之好，它是可组合的，这意味着你可以组合和混合不同的动画来创建自己的高度可定制的 CSS 动画，而无需编写一个单一的关键帧。 制作动画就像用文字描述一样简单 例如，你可以通过编写 xyz = "fade big up" 来创建动画，该动画可以使用 AnimXYZ 淡入淡出，按比例放大和向上移动。 AnimXYZ 还有一个小软件包，基本功能是 2.68kb，如果包含方便的实用程序，则是 11.4kb。
14 天前 / 冷星1024
点击上方“前端下午茶”，选择“设为星标”第一时间关注技术干货！ 本文代码略多，希望大家耐心观看 背景介绍在 2020 年，Vue3 的学习一直被我鸽到了 11 月份，在学完以后，我自己做了一个 Vue3 的小项目 nav-url，也整理了我对于如何快速上手 Vue3 的几篇博客，很高兴受到了大家的指点和喜欢： 自己设计的 Vue3 的实用项目（内含对项目亮点的实现思路与介绍）在上一篇博客中，我详细介绍了一下我发的第一版项目的特色、亮点以及所有核心功能的实现，希望大家可以前往阅读体验一下（记得用电脑打开，因为这是一个 PC 端的项目） 然而...
16 天前 / 那当然y
写文章 Vue3,我决定不再使用 Vuex 心有猛虎 qy 微信公众号：趣玩前端 102 人赞同了该文章在开发基于 Vue3 的项目中发现我们可以不再依赖 Vuex 也能很方便的来管理数据，只需要通过 Composition Api 可以快捷的建立简单易懂的全局数据存储。 创建 State 通过 reactive 我们来创建 state,暴露的 IState 是用来方便其他文件来接受 State 对象 import { reactive } from 'vue'export interface IState {code: stringtoken: stringuser: any}export const State: IState = {code: '',token: '',user: {}}export function createState() {return reactive(State)...
33 天前 / Dunizb
文末福利资源更新 Vue 生态系统中有一个名为 Vite 的新构建工具，它的开发服务器比 Vue CLI 快 10-100 倍。 这是否意味着 Vue CLI 已经过时了？在本文中，我将比较这两种构建工具，并说明它们的优缺点，以便你可以决定哪一种适合你的下一个项目。Vue CLI 概述大多数 Vue 开发人员都知道，Vue CLI 是使用标准构建工具和最佳实践配置快速建立基于 Vue 的项目的不可或缺的工具。其主要功能包括：工程脚手架带热模块重载的开发服务器插件系统用户界面在本讨论中需要注意的是，Vue CLI 是构建在 Webpack 之上的...
77 天前 / clumsy
前言前几天我用 Vue3 重构了我那个 Vue2 的开源项目，最后还遗留了一个问题：项目中用的一个 websocket 插件还不能正常使用。于是，我决定重写这个插，让其支持 Vue3。 本文将记录下重写这个插件的过程并将其发布至 npm 仓库，顺便给插件作者提个 PR，欢迎各位感兴趣的开发者阅读本文。 插件解读 image-20201103005333494 如上图所示就是即将要重构的插件，目前有 735 个 star，我们先将插件代码 clone 到本地。 gitclonehttps://github.com/nathantsoi/vue-native-websocket 下载到本地后，用你喜欢的 ide 打开它...
95 天前 / 江米小枣tonylua
在 Vue 3 的 Composition API 中，采用了 setup() 作为组件的入口函数。 在结合了 TypeScript 的情况下，传统的 Vue.extend 等定义方法无法对此类组件给出正确的参数类型推断，这就需要引入 defineComponent() 组件包装函数，其在 rfc 文档中的说明为： https://composition-api.vuejs.org/api.html#setup interfaceData{ [key:string]:unknown } interfaceSetupContext{ attrs:Data slots:Slots emit:(event:string,...args:unknown[])=>void } functionsetup(props:Data,context:SetupContext):Data To get type inference for the arguments passed to...
96 天前 / 江米小枣tonylua
不同于面向对象编程（OOP）中通过抽象出各种对象并注重其间的解耦问题等，函数式编程（FP） 聚焦最小的单项操作，将复杂任务变成一次次 f(x) = y 式的函数运算叠加。函数是 FP 中的一等公民（First-class object），可以被当成函数参数或被函数返回；同时，这些函数应该不依赖或影响外部状态，这意味着对于给定的输入，将产生相同的输出。 在 Vue 中，一个函数式组件（FC - functional component）就意味着一个没有实例（没有 this 上下文、没有生命周期方法、不监听任何属性、不管理任何状态）的组件。
111 天前 / Dunizb
文末领取昨天的红包抽奖抽中的金额（没想到那个抽奖是平台套路，抱歉，第一次用）以及查看 106 期中奖用户在本文中，我将在不使用任何库的情况下将 dark\Light 模式功能实现到我们的 Vue Vite 应用程序中。我们将首先创建一个简单的 Vite 应用程序，然后为我们的应用程序设置一个简单的用户界面。在创建我们的 Vue 应用程序之前，我想提到 WrapPixel 提供的一些很棒的免费 Vue 模板 [1]，它们可以免费下载并用于个人和商业用途。
116 天前 / 开发者头条
大家好，我是周刊菌。「码农周刊 VIP 会员」推出 24 周啦！感谢亲们的大力支持！第 024 期「码农周刊 VIP 会员专属邮件周报」已发送完毕，请注意查收。告诉大家一个好消息：已有数位上市公司 CTO 低调订阅了我们的「码农周刊 VIP 会员专属邮件周报」，感谢肯定！ 以下内容选自「码农周刊 VIP 会员」圈子，每日更新，精彩不断。 「码农周刊 VIP 会员」是什么？简介版码农周刊 VIP 会员 = 全年 52 期「VIP 会员专属邮件周报」 + 只限 VIP 会员加入的交流圈子 + 大厂「内推机会」 + N 多福利 详细版 点击「阅读原文」即可查看详细介绍 加入「码农周刊 VIP 会员...
121 天前 / 九彩拼盘
前言 前两天尤大在 vue 3.0 beta 直播中提到了一个 vite 的工具，而且还发推表示再也回不去 webpack 了， 还引来了 webpack 核心开发人员肖恩的搞笑回复， 那就让我们一起来看一下 vite 到底有啥魔力？ 什么是 Vite？github：https://github.com/vitejs/vite Vite 是一个由原生 ESM 驱动的 Web 开发构建工具。在开发环境下基于浏览器原生 ES imports 开发，在生产环境下基于 Rollup 打包。 它主要具有以下特点： 快速的冷启动即时的模块热更新真正的按需编译那废话少说，我们先直接来试用一下。
130 天前 / 冷星1024
vue 已是目前国内前端 web 端三分天下之一，同时也作为本人主要技术栈之一，在日常使用中知其然也好奇着所以然，另外最近的社区涌现了一大票 vue 源码阅读类的文章，在下借这个机会从大家的文章和讨论中汲取了一些营养，同时对一些阅读源码时的想法进行总结，出产一些文章，作为自己思考的输出，本人水平有限，欢迎留言讨论~ 目标 Vue 版本：2.5.17-beta.0 vue 源码注释：https://github.com/SHERlocked93/vue-analysis 声明：文章中源码的语法都使用 Flow，并且源码根据需要都有删节 ( 为了不被迷糊 @_@)，如果要看完整版的请进入上面的 github 地址...