随笔分类 - 框架
摘要：vue 在插入、更新或者移除 DOM 时，动态添加css类名来达到想要的动画效果 1.transition标签 给元素包裹一个transition标签，并设置name属性的值，这个值可以随意设置，但是他会决定Dom更新时自动添加的css类名 这里name="xxx"作为演示 <div id="app
阅读全文
posted @ 2020-11-23 17:45
浅笑·
摘要：创建项目 首先，我们使用官方提供的脚手架 create-react-app 来创建一个项目： npx create-react-app eslint-prettier-react-demo/ cd eslint-prettier-react-demo/ Eslint 安装依赖 Eslint 是一个可
阅读全文
posted @ 2020-11-23 17:43
浅笑·
摘要：Hooks 的 API 可以参照 react 官网。本文主要是结合 Demo 详细讲解如何用 Hooks 来实现 react Class Component 写法，让大家更深的理解 Hooks 的机制并且更快的入门。 注意：Rax 的写法和 React 是一致的，本文 Demo 基于 React 实
阅读全文
posted @ 2020-11-23 17:40
浅笑·
摘要：webpack整个的构建过程是基于事件流 webpack 就像一条生产线，要经过一系列处理流程后才能将源文件转换成输出结果。 这条生产线上的每个处理流程的职责都是单一的，多个流程之间有存在依赖关系，只有完成当前处理后才能交给下一个流程去处理。 插件就像是一个插入到生产线中的一个功能，在特定的时机对生
阅读全文
posted @ 2020-11-23 17:39
浅笑·
摘要：Flutter是Google开发的新一代跨平台方案，Flutter可以实现写一份代码同时运行在iOS和Android设备上，并且提供很好的性能体验。Flutter使用Dart作为开发语言，这是一门简洁、强类型的编程语言。Flutter对于iOS和Android设备，提供了两套视觉库，可以针对不同的平
阅读全文
posted @ 2020-11-23 17:36
浅笑·
摘要：策略模式是JavaScript设计模式中行为型的设计模式； 定义： 定义一系列算法，并将这些算法各自封装成策略类（方法），然后将不变的部分和变化的部分分离开来，并且这些算法可以相互替换 白话解释： 实际上所谓的策略模式就是值根据不同的策略来执行不同的方法，是不是很类似与if-else分支判断；但是策
阅读全文
posted @ 2020-11-23 17:34
浅笑·
摘要：简单应用 我们先来看一个简单的应用示例： <div id="app"> <input id="input" type="text" v-model="text"> <div id="text">输入的值为：{{text}}</div> </div> <script> var vm = new Vue
阅读全文
posted @ 2020-11-23 17:33
浅笑·
摘要：axios 是 vue 官方推荐的一个 HTTP 库，用 axios 官方简介来介绍它，就是：Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。 作为一个优秀的 HTTP 库，axios 打败了曾经由 vue 官方团队维护的 vue-resource，获
阅读全文
posted @ 2020-11-23 17:28
浅笑·
摘要：前言 在我们平时的开发中会经常使用到背景图片，下面我这介绍的是Container通过BoxDecoration来设置的 布局 1、创建路由子页面 Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title:
阅读全文
posted @ 2020-11-23 17:25
浅笑·
摘要：一、如何使用redux 首先要明确为什么要使用redux，这一点很重要，如果不知道为什么使用redux，那么在开发的过程中肯定不能合理的使用redux.首先来看redux的本质： redux做为一款状态管理工具，主要是为了解决组件间通信的问题。 既然是组件间的通信问题，那么显然将所有页面的状态都放入
阅读全文
posted @ 2020-11-23 17:23
浅笑·
摘要：我们平时在开发部署 Node.js 应用的过程中，对于应用进程启动的耗时很少有人会关注，大多数的应用 5 分钟左右就可以启动完成，这个过程中会涉及到和集团很多系统的交互，这个耗时看起来也没有什么问题。 目前，集团 Serverless 大潮已至，Node.js serverless-runtime
阅读全文
posted @ 2020-11-23 17:21
浅笑·
摘要：当我们使用编译器创建一个新Flutter应用的时候，我们可以在主界面看到两个小部件StatelessWidget和StatefulWidget。这是两个最常见使用最频繁的小部件了。 StatelessWidget ，StatefulWidget StatelessWidget 状态不可改变的，它内部
阅读全文
posted @ 2020-11-23 17:15
浅笑·
摘要：其实在JavaScript的发展中，它主要是在浏览器前端中被应用广泛。因为在实际应用中， JavaScript的表现能力主要取决于宿主环境的API支持程度， 在最早期，只有对BOM, DOM的支持，随着html5的出现，在浏览器中出现了更多，更强大的API供JavaScript调用，但是这些都是发生
阅读全文
posted @ 2020-11-23 17:11
浅笑·
摘要：在项目中往往会有这样的需求： 弹出框（或Popover）在 show 后，点击空白处可以将其 hide。 针对此需求，整理了三种实现方式，大家按实际情况选择。 当然，我们做项目肯定会用到 UI 框架，常见的 Element 中的组件提供了这样的方法。 但是，就算使用框架，有些时候还是要用到的，比如：
阅读全文
posted @ 2020-11-23 17:10
浅笑·
摘要：写在前面 最近又抽时间把 vue-next/runtime-core 的源码陆陆续续地看完了，期间整理了很多笔记，但都是碎片化的。本来是想整理一下，写成一篇文章分享出来的，但是感觉最终的成果物只能是一篇篇幅巨长的解析文，就算我一行一行的把源码加上注释，其阅读体验也会很差，因为每个人读代码的习惯不同，
阅读全文
posted @ 2020-11-23 17:09
浅笑·
摘要：背景 在做小程序时候，我们经常会有一个需求，需要将小程序分享到朋友圈，但是朋友圈是不允许直接分享小程序，那我们还有其他的办法解决吗?答案肯定是有的，即 canvas 生成个性化海报分享图片到朋友圈 分析 小程序中有大量的生成图片需求，但是使用过 canvas 的人，都会发现一些难以预料的问题>>有关
阅读全文
posted @ 2020-11-23 17:06
浅笑·
摘要：再有一棵树形结构的JavaScript对象后，我们现在需要做的就是将这棵树跟真实的Dom树形成映射关系，首先简单回顾之前遇到的mountComponent方法： export function mountComponent(vm, el) { vm.$el = el ... callHook(vm,
阅读全文
posted @ 2020-11-23 17:04
浅笑·
摘要：在开发微信小程序之前，个人从来没有接触过开发中涉及到第三方服务器交互的流程。在开发的过程本身倒是没有什么太大的意外，只是在维护服务器登陆状态这一点很讨厌。因为涉及到自身服务器的登录状态以及微信官方服务器登陆状态三方的关系。 下图是微信登陆机制: 在这种场景下，个人非常关注的点在于: 如何能够无感知的
阅读全文
posted @ 2020-11-23 16:43
浅笑·
摘要：简介 看《深入浅出webpack》总结一下常用的webpack的属性的含义并加了一些自己的链接，写在一个文件下更能有全局感受，更能理解各个属性中间的关系，重点要关注entry,output,resolve,module, plugins几部分 配置示例 这并不是一个拿来可用的配置，主要是为了更好理解
阅读全文
posted @ 2020-11-22 20:44
浅笑·
摘要：带单个修饰符的组件 一个组件可能有不同状态。状态应该使用修饰符类来实现。 <!-- 这样写 --> <button class="btn btn--secondary"></button> <style lang="scss"> .btn { display: inline-block; color
阅读全文
posted @ 2020-11-22 20:38
浅笑·
浙公网安备 33010602011771号