随笔分类 - 框架
摘要：抛砖引玉 vue 的特点之一就是响应式，但是有些时候数据更新了，我们看到页面上的 DOM 并没有立刻更新。如果我们需要在 DOM 更新之后再执行一段代码时，可以借助 nextTick 实现。 我们先来看一个例子 export default { data() { return { msg: 0 }
阅读全文
posted @ 2020-10-03 23:16
酷儿q
摘要：随着 vue.js 单页应用（SPA）变得相当复杂，你开始需要 vue 路由以及嵌套路由。嵌套路由允许更复杂的用户界面以及相互嵌套的组件。让我们创建一个相对简单的用例，来展示 Vue Router 中嵌套路由的实用性。 用 Vue CLI 进行设置 如果尚未安装，请运行以下命令全局安装 Vue CL
阅读全文
posted @ 2020-10-03 23:14
酷儿q
摘要：如何使用 <style scoped> .klass { /* style */ } </style> scoped 是一个极其常用的 <style> 标签属性，使用后这一块样式能“神奇地”只应用在当前单文件组件，不会干扰到其父子组件。 其原理其实很简单，只要加上了 scoped，当前文件所有元素（
阅读全文
摘要：前言 无论在任何的语言或框架中，我们都提倡代码的复用性。对于vue来说也是如此，相同的代码逻辑会被封装成组件，除了复用之外，更重要的是统一管理提高开发效率。我真就接手过一个项目，多个页面都会用到的列表，没有去封装列表组件，只要有一点改动，每个页面都得加上。很肯定的说，没有用组件化开发的vue项目是没
阅读全文
posted @ 2020-10-03 23:10
酷儿q
摘要：背景 对于程序开发者而言，开发一个项目不仅仅注重效率和功能，前端的性能问题也是非常重要的。这直接影响用户的体验，从而间接的也反应该项目质量的好坏。 影响项目性能的原因有很多，如：资源文件的大小，业务的繁杂程度等，所以前端优化的方式也很多。这些东西很零碎，容易被人遗忘。 优化一： vue-router
阅读全文
posted @ 2020-10-03 23:09
酷儿q
摘要：理解 随着前端业务的发展， 我们一般在写一个较为大型的vue项目时候，会使用到vue-router，来根据指定的url或者hash来进行内容的分发，可以达到不像服务端发送请求，就完成页面内容的切换，能够减少像服务器发送的请求，让用户进行页面跳转时候能够更快，体验更好 疑问 在初学vue-router
阅读全文
posted @ 2020-10-03 23:07
酷儿q
摘要：所有使用基于组件的体系结构(如vue和react)的开发人员都知道，创建可重用组件是很困难的，而且大多数情况下，最终会通过传入大量的属性，以便从外部更容易地控制和自定义组件。这并不坏，但是传递大量属性确实会变得有点麻烦和丑陋。 我们以 vuetify 的按钮组件为例，它是最简单的组件之一。假设我们想
阅读全文
摘要：quill 定制富文本编辑器 很多时候 <textarea> 并不能满足我们对文本输入的需求，当我们需要为输入的文本添加格式时，我们需要使用像 quill 这样的富文本编辑器来完成富文本的输入。 本文将会详细的讲解如何使用 quill 定制一个自己的富文本编辑器。 这里面定制了两个特殊的功能（添加卡
阅读全文
posted @ 2020-10-03 23:04
酷儿q
摘要：1、Jest Jest是Facebook团队构建和维护的JavaScript测试框架，基于Jasmine的JavaScript单元测试框架。Jest在2018年接受度非常高，今年在JavaScript社区更是如此，根据Github的数据，目前超过150万个项目在使用Jest。 在过去的一年里继续使用
阅读全文
posted @ 2020-10-03 23:03
酷儿q
摘要：在Node.js开发中，当遇到 buffer，stream，和二进制数据处理时，你是否像我一样，总是感到困惑？这种感觉是否会让你认为不了解它们，以为它们不适合你，认为而这些是Node.js作者们的事情？ 确实，这些东西可能非常令人生畏，尤其是当你在缺乏计算机底层基础知识，进行相关的开发。 可悲的是，
阅读全文
posted @ 2020-10-03 23:01
酷儿q
摘要：背景 在 js 中，添加到页面上的事件处理程序数量将直接关系到页面的整体运行性能。导致这一问题的原因有很多方面，比如： 每个函数都是对象，每个对象都会占用内存，内存中的对象越多，性能就越大；必须事先指定所有事件处理程序而导致的 DOM 访问次数，会延迟整个页面的交互时间； 那我们该怎样从事件处理程序
阅读全文
posted @ 2020-10-03 22:59
酷儿q
摘要：应用场景：多次点击提交按钮 首次提交执行，重复提交就会等待一定的时间提交执行 //util.js export const debounce = (fn, wait) => { let delay = wait|| 500 let timerout; return function () { let
阅读全文
posted @ 2020-10-03 22:58
酷儿q
摘要：项目开发中, 大多数团队都会选择使用开源的 UI 库, 那么在 next.js 中要引入第三方库. 我们需要进行相应的配置. 在 css 预处理器上, 目前团队使用 scss . 个人觉得非常好用. 如果要使用 scss 我们必须要做简单配置, 否则是无法使用的 配置下载 # npm npm ins
阅读全文
posted @ 2020-10-03 22:57
酷儿q
摘要：刚开始看到这个功能的时候一定觉得so easy，开始的时候我也是这么觉得的，这还不简单，然而真正写的时候才发现并没有想象的那么简单。 先上图，不上图你们都不想看，我难啊，到Github： https://github.com/781238222/flutter-do 上给个小星星可还行，如果能for
阅读全文
posted @ 2020-10-03 22:56
酷儿q
摘要：Rxjs 是 reactive Extensions for JavaScript 的缩写，起源于 reactive Extensions，是一个基于可观测数据流 Stream 结合观察者模式和迭代器模式的一种异步编程的应用库。Rxjs 是 Reactive Extensions 在 JavaScr
阅读全文
摘要：处理边界情况 $root 用来访问根组件$parent 用来从一个子组件访问父组件的实例ref 和 $refs 的用法 在组件上面使用 ref 这个属性绑定，属性值自取，然后就可以通过 $refs.属性名 这种方式去获取到指定组件的实例了。其实不仅仅是组件能够使用 ref ,标签元素也能使用。 依赖
阅读全文
posted @ 2020-10-03 22:54
酷儿q
摘要：项目不大, 又不想用vuex, 那么使用Observable来实现状态共享也不失为一个选择。 先来看看官方资料： vue.observable( object ) 2.6.0 新增 参数 ：{Object} object用法 ：让一个对象可响应。Vue 内部会用它来处理 data 函数返回的对象 此
阅读全文
摘要：环境准备 在index.html引入flv.js依赖 <script type='text/JavaScript' src="https://cdn.bootcss.com/flv.js/1.5.0/flv.js"></script> 数据准备好后播放视频 先取到接口数据，后播放。使用async a
阅读全文
摘要：props: include - 字符串或正则表达式。只有名称匹配的组件会被缓存。 exclude - 字符串或正则表达式。任何名称匹配的组件都不会被缓存。 max - 数字。最多可以缓存多少组件实例。 用法 <keep-alive> 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。和 <t
阅读全文
摘要：MVC MVC模式的意思是，可以分成三个部分 视图（View）：用户界面。 控制器（Controller）：业务逻辑 模型（Model）：数据保存 各部分之间的通信方式如下。 View 传送指令到 Controller Controller 完成业务逻辑后，要求 Model 改变状态 Model 将
阅读全文
浙公网安备 33010602011771号