12 2018 档案
摘要：``` *自定义一个图片等比缩放函数 *@param string $picname 被缩放图片名 *@param string $path 被缩放图片路径 *@param int $maxWidth 图片被缩放后的最大宽度 *@param int $maxHeight 图片被缩放后的最大高度 *@param string $pre 缩放后的图片名前缀，默认为"s_" *@retur...
阅读全文
摘要：``` /** * 取多维数据中某字段的值 * @param array $array 数据源数组 * @param string|array $field 要获取的字段 * @return array 结果数组 */
function array_muliti_field($array, $field)
{ $resp...
阅读全文
摘要：能够使多域名但是只有一个站点的小站，通过路由访问到各个指定目录
阅读全文
摘要：1查找字符位置函数： strpos($str,search,[int]):查找search在$str中的第一次位置从int开始； stripos($str,search,[int]):函数返回字符串在另一个字符串中第一次出现的位置。该函数对大小写不敏感 strrpos($str,search,[in
阅读全文
摘要：DDOS的全称是Distributed Denial of Service，即"分布式拒绝服务攻击"，是指击者利用大量“肉鸡”对攻击目标发动大量的正常或非正常请求、耗尽目标主机资源或网络资源，从而使被攻击的主机不能为合法用户提供服务。 DDOS攻击的本质是： 利用木桶原理，寻找利用系统应用的瓶颈；阻
阅读全文
摘要：``` connect('127.0.0.1',6379,1);//短链接，本地host，端口为6379，超过1秒放弃链接 $redis->open('127.0.0.1',6379,1);//短链接(同上) $redis->pconnect('127.0.0.1',6379,1);//长链接，本地host，端口为6379，超过1秒放弃链接 $redis->popen('127...
阅读全文
摘要：``` //二分查找
function bin_sch($array, $low, $high, $k)
{ if ($low $i; $j--) { if ($array[$j] =')) { $json = json_decode($json, $assoc, $depth, $options); } elseif (version_...
阅读全文
摘要：``` 相同) header('Refresh: 3; url=http://www.maiyoule.com/'); echo '10后跳转到http://www.maiyoule.com'; // 重写 X-Powered-By 值 header('X-Powered-By: PHP/5.3.0'); header('X-Powered-By: Brain/0....
阅读全文
摘要：ArrayHelper.php <?php / php 数组助手类 Class ArrayHelper @package app\helper / class ArrayHelper { / @brief get_ids_arr 取得某个二维数组里的id集合 $arr = array( arr
阅读全文
摘要：``` /** * 高效判断远程文件是否存在 * @param $file * @return bool 存在返回 true 不存在或者其他原因返回false */
function remoteFileExist($file)
{ if(preg_match('/^http:\/\//',$file)){ //远程文件 if(ini_get('a...
阅读全文
摘要：开始 今天要说的代码全在codegen文件夹中，在说实现原理前，还是先看个简单的例子！ 上述类名为container的元素节点包含5个子节点（其中3个是换行文本节点），转化成的AST语法树： AST语法树转的render函数长这样： 可以的看出，render函数做的事情很简单，就是把语法树每个节点的
阅读全文
摘要：vue提供了一个封装动画的组件 <transition name="tr"></transition>,将需要执行动画的元素包裹在该组件中，在通过css修改样式即可满足需求命名该动画的样式使用 .v enter等过渡类名来定义动画 如<transition name="
阅读全文
摘要：bind函数 bind 函数挂在 Function 的原型上 Function.prototype.bind 创建的函数都可以直接调用 bind,使用： bind 的作用： bind() 方法调用后会创建一个新函数。当这个新函数被调用时，bind() 的第一个参数将作为新函数运行时的 this的值，
阅读全文
摘要：window与Objet 1、 window.__proto__ === Window.prototype 2、 window.__proto__.__proto__ === 窗口属性(WindowProperties) 3、 window.__proto__.__proto__.__proto__
阅读全文
摘要：笔记整理自廖雪峰老师Git教程 创建本地版本库 1、 创建版本库 (origin是远程库的名字) 第一次推送master分支，加上 u参数，把本地的master分支和远程的master分支关联起来 把本地的修改提交到远程的master分支 如果我们只有一个master分支，就可以直接： git cl
阅读全文
摘要：gitlab 安装、配置 对于企业级的私有 git 仓库，gitlab 是个不错的选择。 今天就来说说 gitlab 的安装、配置。 系统配置建议：最低双核 4G 内存。 当前针对 gitlab 版本：11.5.3。 1. 说明 根据官方的安装教程，选取 ubuntu 环境下的社区版进行安装：htt
阅读全文
摘要：数据库内容太多，复制粘贴太麻烦？那就用代码实现把，把代码写好了，导出还不容易吗，访问即可导出。 excel.php 然后访问excel.php就可以弹出表格下载了。作者：TANKING网站：likeyunba.com微信：likeyunba520 来源：https://segmentfault.co
阅读全文
摘要：准备一个容器 首先在body外插入一个absolute的容器避免重绘： const svgWidthTestContainer = document.createElement('svg'); svgWidthTestContainer.setAttribute('id', 'svgWidthTes
阅读全文
摘要：最近在看Node源码的时候，偶然间，看到如下函数： / Remove byte order marker. This catches EF BB BF (the UTF 8 BOM) because the buffer to string conversion in translates it t
阅读全文
摘要：起步 HTML <script src="https://unpkg.com/vue/dist/vue.js"></script> <script src="https://unpkg.com/vue router/dist/vue router.js"><
阅读全文
摘要：前言 本文纯属个人平时实践过程中的一些经验总结，算是一点点小技巧吧，不是多么高明的技术，如果对你有帮助，那么不胜荣幸。 本文不涉及罕见API使用方法等，大部分内容都是基于对vue的一些实践而已。由于涉嫌投机取巧，可能会带来一些不符合规范的副作用，请根据项目要求酌情使用。 多个页面都使用的到方法，放在
阅读全文
摘要：首先，JavaScript是一个单线程的脚本语言。 所以就是说在一行代码执行的过程中，必然不会存在同时执行的另一行代码，就像使用alert()以后进行疯狂console.log，如果没有关闭弹框，控制台是不会显示出一条log信息的。 亦或者有些代码执行了大量计算，比方说在前端暴力破解密码之类的鬼操作
阅读全文
摘要：前言 在学习eventloop之前，我们需要复习一下js的单线程和异步。虽说js是单线程的，但是在浏览器和Node中都做了相应的处理。如浏览器中的web workers（工作线程），Node中的child_process（子进程）。它们的出现对大量计算的分解起到了促进作用。 事件循环 当进程启动时，
阅读全文
摘要：前记 前面我已经写了一篇关于Cookie的文章，但是那时候我其实理解的并不是很深刻，会有些搞不懂的地方，今天我就再写一次，博客也是我的学习笔记 Cookie Cookie是服务器发送到用户浏览器并保存在本地的一小块数据，它会在浏览器下次向同一服务器再发起请求时被携带并发送到服务器上。通常，它用于告知
阅读全文
摘要：一、let和const 在JavaScript中咱们以前主要用关键var来定义变量，ES6之后，新增了定义变量的两个关键字，分别是let和const。对于变量来说，在ES5中var定义的变量会提升到作用域中所有的函数与语句前面，而ES6中let定义的变量则不会，let声明的变量会在其相应的代码块中建
阅读全文
摘要：场景 实际业务中可能出现重复消费一个可读流的情况，比如在前置过滤器解析请求体，拿到body进行相关权限及身份认证；认证通过后框架或者后置过滤器再次解析请求体传递给业务上下文。因此，重复消费同一个流的需求并不奇葩，这类似于js上下文中通过 deep clone一个对象来操作这个对象副本，防止源数据被污
阅读全文
摘要：概述 这是设置代理的神器，webpack的devServer.proxy就是使用了非常强大的 http proxy middleware 包。Node.js代理很简单。 轻松配置代理中间件进行连接，发布，浏览器同步等等。代理 /api 向 http://www.example.org请求 注意：需设
阅读全文
摘要：Puppeteer Puppeteer 是一个Node库，它提供了一个高级API来控制DevTools协议上的Chrome或Chromium，常用于爬虫、自动化测试等，你在浏览器手动完成的大多数事情都可以使用它来完成。 站内有很多文章介绍Puppeteer，此处就不再介绍。 但是 但是无论是爬虫还是
阅读全文
摘要：目标 上面是最常见的vue的用法, 现在我就只实现一件事 开始动工 1、 第一步, 先声明一个Mvvm类 我们一开始定义的 someStr属性是定义在option.data中的, 我们想要 myMvvm.someStr这样赋值的时候和option的data相关联, 需要中间做一个代理,修改代码 2、
阅读全文
摘要：ES6 通过字面量语法扩展、新增方法、改进原型等多种方式加强对象的使用，并通过解构简化对象的数据提取过程。 一、字面量语法扩展 在 ES6 模式下使用字面量创建对象更加简洁，对于对象属性来说，属性初始值可以简写，并可以使用可计算的属性名称。对象方法的定义消除了冒号和 function 关键字，示例如
阅读全文
摘要：(～￣(OO)￣)ブ，闭包，一个面试长问的问题，本白也迷糊了很久。慢慢不断地有了自己的一点认识，这里分享一下~~~废话不多说，先看题： 结果是什么呢？？？大家可以先自己想一下，然后来听我分析（xiache）( ^.^ )；首先我们从for循环开始看起，循环了2次，分别执行了outputp "0" ;
阅读全文
摘要：CQRS是啥？DDD又是啥？ 这两个概念其实没什么神秘的，当然此文章中的这两个概念以曾老师的课程为准（关于CQRS和DDD的标准概念，google上已经很多了，不再赘述。） DDD(Domain Driven Design)，领域驱动设计开发。 DDD和OOP有什么同吗？其实就我个人经验来说，没有任
阅读全文
摘要：会从整个数组中遍历满足条件dobj的东西 最后的结果会是: 来源：https://segmentfault.com/a/1190000016775324
阅读全文
摘要：前言 最近几年前端技术发展日新月异，特别是单页应用的普及。组件化、工程化、自动化成了前端发展的趋势。webpack已经成为了前端打包构建的主流，但是一些老古董的项目还是存在的，也有优化的必要，正好公司的老项目需要优化，不多说拿gulp实践一下。 本文需要安装node（自行安装），并了解过gulp
阅读全文
摘要：前言 我们以查找指定目录下的最大文件为例，感受从 回调函数 > Promise > Generator > Async 异步处理方式的改变。 API 介绍 为了实现这个功能，我们需要用到几个 Nodejs 的 API，所以我们来简单介绍一下。 fs.readdir readdir
阅读全文
摘要：前言 本文主要介绍数组常见遍历方法：forEach、map、filter、find、every、some、reduce，它们有个共同点：不会改变原始数组。 一、forEach：遍历数组 我们再来看个例子：遍历数组中的值,并计算总和 二、map：将数组映射成另一个数组 map通过指定函数处理数组的每个
阅读全文
摘要：RabbitMQ官方提供的教程https://www.rabbitmq.com/tuto...，是基于回调的。 下面将给出基于Promise式的写法。并且实现动态的队列绑定 初始化配置 const amqp = require('amqplib') // rabbitMQ地址 const {amqp
阅读全文
摘要：``` var express = require('express'); var mysql = require('mysql'); var app = express(); var bodyParser = require('body parser'); //链接数据库 var connecti
阅读全文
摘要：前段时间开始研究ast，然后慢慢的顺便把babel都研究了，至于ast稍后的时间会写一篇介绍性博客专门介绍ast，本博客先介绍一下babel的基本知识点。 背景： 由于现在前端出现了很多非es5的语法，如jsx，.vue，ts等等的格式和写法，如果要在浏览器的设备上识别并执行，需要额外将这些非传统格
阅读全文
摘要：微信小程序之登录态的探索 来源：https://segmentfault.com/a/1190000017496137
阅读全文
摘要：关于前端路由复用策略网上的文章很多，大多是讲如何实现tab标签切换历史数据，至于如何复用的原理讲的都比较朦胧，代码样例也很难适用各种各样的路由配置，比如懒加载模式下多级嵌套路由出口网上的大部分代码都会报错。我希望能通过这篇文章把如何复用路由的原理讲明白，让小伙伴能明明白白的实用路由复用策略，文字中有
阅读全文
摘要：标题JavaScript自定义事件 最近遇到一个基于jQuery项目,项目中的功能节点页面都是通过iframe实现,但是各个iframe之间有时需要相互通信,互相相应一些事件,为了更愉快的编码所以想到了自定义事件,还别说用起来竟然有点像vue的组件通信 来源：https://segmentfault
阅读全文
摘要：前言 首先对于一个简单的聊天室，大家应该都有一定的概念了，这里我们省略用户模块的讲解，而是单纯的先说说聊天室的几个功能：自我对话、好友交流、群聊、离线消息等。 今天我们要做的demo就能帮我们做到这一点啦！！！ 采用框架 我们整个Demo基本不需要大家花费太多时间，就可以实现以上的几个功能。 首先，
阅读全文
摘要：背景 最近项目需要上线支付宝小程序，同时需要走用户的授权流程完成用户信息的存储，以前做过微信小程序的开发，本以为实现授权的过程是很简单的事情，但是再实现的过程中还是遇到了不少的坑，因此记录一下实现的过程 学到的知识 支付宝开放接口的调用模式以及实现方式 支付宝小程序授权的流程 RSA加密方式 吐槽点
阅读全文
摘要：通配符域名不同于一般的单域名证书. 为了解决之前一篇短文中通配域名通过DNS方式验证的证书自动更新问题. 需要使用到第三方域名提供商的API, 用于自动添加域名的TXT记录, 实现自动验证并完成证书更新过程. 要求和适应性 要求了解 Let's encrypt 通配域名(二级, 三级) 使用 Clo
阅读全文
摘要：原型 异步 一、什么是单线程，和异步有什么关系 单线程：只有一个线程，同一时间只能做一件事原因：避免DOM渲染的冲突解决方案：异步 为什么js只有一个线程：避免DOM渲染冲突 浏览器需要渲染DOM JS可以修改DOM结构 JS执行的时候，浏览器DOM渲染会暂停 两端JS也不能同时执行(都修改DOM就
阅读全文
摘要：年底了，故事总是会有很多。 刚了一波通宵加班，趁着有时间，过了一遍Vim教程，顺便汇总下常用命令。 对于以 OSX / Linux为开发环境的伙伴们，应该并不陌生。因其轻便，扩展性，可定制化，一直很受开发者追捧。高阶大神，袖中必有深藏。 Vim编辑器简洁易用，在终端上可用来快速查看修改文档。虽然与其
阅读全文
摘要：写在前面 在前端开发中，npm已经是必不可少的工具了。使用npm，不可避免的就要和package.json打交道。平时package.json用得挺多，但是没有认真看过官方文档。本文结合npm官方文档以及自己平时使用过程中的感悟，谈一谈package.json。官方文档在这里。 初始化 使用npm
阅读全文
摘要：NPM是Node.js的包管理工具，随着Node.js的出现，以及前端开发开始使用gulp、webpack、rollup以及其他各种优秀的编译打包工具（大多数采用Node.js来实现），大家都开始接触到一些Node.js，发现了使用NPM来管理一些第三方模块会很方便。 大家搬砖的模式也是从之前的去插
阅读全文
摘要：``` var express = require('express'); var mysql = require('mysql'); var app = express(); var bodyParser = require('body parser'); //链接数据库 var connecti
阅读全文
摘要：ES6 新的数组方法、集合、for of 循环、展开运算符（...）甚至异步编程都依赖于迭代器（Iterator ）实现。本文会详解 ES6 的迭代器与生成器，并进一步挖掘可迭代对象的内部原理与使用方法 一、迭代器的原理 在编程语言中处理数组或集合时，使用循环语句必须要初始化一个变量记录迭代位置，而
阅读全文
摘要：最近需要单独使用到koa compose这个模块，虽然使用koa的时候大致知道中间件的执行流程，但是没仔细研究过源码用起来还是不放心(主要是这个模块代码少，多的话也没兴趣去研究了)。 koa compose看起来代码少，但是确实绕。闭包，递归，Promise。。。看了一遍脑子里绕不清楚。看了网上几篇
阅读全文
摘要：貌似很多人都爱用这个作为写文章的初尝试，那来吧。遍历文件夹下的所有文件，如遍历文件夹下并操作HTML/CSS/JS/PNG/JPG步骤如下：1、传入一个路径，读取路径里面所有的文件；2、遍历读取的文件，判断当前文件是文件还是文件夹；3、if: 前目录为文件，输出当前文件绝对路径，return；4、e
阅读全文
摘要：前言 JavaScript是一门动态语言，所谓的动态语言可以暂时理解为在语言中的一切内容都是不确定的。比如一个变量，这一时刻是个整型，下一时刻可能会变成字符串了。虽然变量的数据类型是不确定的，但是各种运算符对数据类型是有要求的。如果运算符发现，运算子的类型与预期不符，就会自动转换类型。 本文主要介绍
阅读全文
摘要：``` const Koa = require('koa') const app = new Koa() const bodyParser = require('koa bodyparser') app.use(bodyParser()) app.use(async (ctx) => { if
阅读全文
摘要：github地址：https://github.com/Rossy11/node 来源：https://segmentfault.com/a/1190000016850510
阅读全文
摘要：需求描述，由于工作的需要，需要将原本用于1280 720的网页改为1920 1080的网页（电视端页面）。需求可以拆分为两部分，代码部分的修改以及图片的修改。在代码部分，需要将所有位置以及大小相关的值乘以1.5，图片的尺寸也要放大1.5倍。首先使用nodejs遍历当前的文件夹： 如果是HTMLCSS
阅读全文
摘要：Vue2介绍 1.vue2.0 Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。 Vue 的核心库只关注视图层 采用单文件组件 复杂大型单页应用程序（SPA） 响应式的数据绑定，与组件化的开发 HTML中的DOM与其他的部分独立开来划分出一个层次，这个层次就叫做
阅读全文
摘要：在对自己开发的组件中经常会做诸如以下的引用： 这样使用相对路径引用虽然是比较常见的做法，不过在中大型项目中，引入的组件较多时，写起来也是极其蛋疼的。 当然，我们可以通过使用 webpack 中的 resolve.alias 配置别名，将某些文件目录配置成固定的引入。 例如上面的示例，我们可以将 ut
阅读全文
摘要：anujs现在只差一个组件（mention）就完全支持阿里的antd UI库了。一共跑通346个测试, 应该是全世界最接近官方React的迷你框架了。 以后的工作就是把React16的一些新特性支持了，包括组件返回数字、字符串、数组， componentDidCatch钩子与createPortal
阅读全文
摘要：Redux是一款状态管理库，并且提供了react redux库来与React亲密配合， 但是总是傻傻分不清楚这2者提供的API和相应的关系。这篇文章就来理一理。 Redux Redux 三大核心 Redux的核心由三部分组成：Store, Action, Reducer。 Store : 是个对象，
阅读全文
摘要：对React熟悉的同学都知道，React中的事件机制并不是原生的那一套，事件没有绑定在原生DOM上，发出的事件也是对原生事件的包装。那么这一切是怎么实现的呢？ 事件注册 首先还是看我们熟悉的代码 这是我们在React中绑定事件的常规写法。经由JSX解析，button会被当做组件挂载。而onClick
阅读全文
摘要：React事件绑定 由于类的方法默认不会绑定this，因此在调用的时候如果忘记绑定，this的值将会是undefined。通常如果不是直接调用，应该为方法绑定this。绑定方式有以下几种： 1. 在构造函数中使用bind绑定this 2. 在调用的时候使用bind绑定this 3. 在调用的时候使用
阅读全文
摘要：枚举对象属性 for....in 列举obj的可枚举属性，包括自身和原型链上的 object.keys() 只列举对象本身的可枚举属性 创建对象的几种方式 对象字面量 通过构造函数 Object.create() 以指定的对象作为原型来创建对象 如何判断对象是否是空对象 对象属性的描述符 属性的描述
阅读全文
摘要：前言 在应用开发中，列表是我们使用频率非常高的一种展现形式，在reactjs项目中更是如此。无处不在的使用更是需要我们小心触发性能瓶颈的深水炸弹。 下面就我最近的总结出的几点心得分享给大家，有什么问题欢迎批评指正。 不要用索引当key值 reactjs要求我们对列表中的每一项设置一个唯一的key值，
阅读全文
摘要：去年，我写了一本关于学习React.js的小书，原来是大约100页。 今年我要挑战自己，把它归纳为一篇文章。 本文不会涵盖什么是React，或者为什么要学习它。 相反，这是面向已经熟悉JavaScript并熟悉DOM API基础知识的人，对React.js的基础知识的介绍。 以下所有代码示例均标示为
阅读全文
摘要：原文地址：Redux or MobX: An attempt to dissolve the Confusion 原文作者：rwieruch 我在去年大量的使用了 Redux，但我最近都在使用 Mobx 来做状态（state）管理。似乎现在社区里关于该选什么来替代 Redux 很自然地成为了一件困惑
阅读全文
摘要：整理一下React中关于state和props的知识点。 在任何应用中，数据都是必不可少的。我们需要直接的改变页面上一块的区域来使得视图的刷新，或者间接地改变其他地方的数据。React的数据是自顶向下单向流动的，即从父组件到子组件中，组件的数据存储在props和state中，这两个属性有啥子区别呢？
阅读全文
摘要：前言 JS模块化编程是前端小伙伴们必不可少的知识，下面妹子将于自认为比较清晰的方式列举出来。 1 require 特点： 1.运行时加载 2.拷贝到本页面 3.全部引入 1.1 CommonJS Node.js就是用CommonJS思想。在CommonJS中，有一个全局性方法require()，用于
阅读全文
摘要：假设我们在react中有如下header组件： 我们在写react组件时结合redux要定义mapStateToProps和mapDispatchToProps两个返回对象的纯函数以便交给connect去包裹使用 具体connect使用查看connect 这里我们就可以用装饰器(Decorator)
阅读全文
摘要：描述 最近在用es6解leetcode，当问题比较复杂时，有可能修正了新的错误，却影响了前面的流程。要用通用的测试工具，却又有杀鸡用牛刀的感觉，所以就写了个简单易用的leetcode开发测试工具，分享与大家。 工具安装 npm i leetcode_test 使用示例1 (问题010) codes:
阅读全文
摘要：1、使用jq判断是否用微信浏览器打开页面 2、使用es6判断是否用微信浏览器打开页面 来源：https://segmentfault.com/a/1190000017389162
阅读全文
摘要：1.数组的解构赋值 我们知道以前我们给一个变量赋值要这样如下： 但是ES6出来之后，我们可以这样： 以上就是从数组中提起值，一一对应赋值，a、b、c分别为1、2、3 aa,bb,cc分别对应1,2,3 d的值为30 e为1, f为[2,3,4,5] x为1，y为undefined，z为[]，如果没有
阅读全文
摘要：JS 中的 this 对每位前端工程师都不陌生，经常看到对象这里 this 那里 this，那什么是 this？答案就是上下文对象，即被调用函数所处的环境，也就是说，this 在函数内部指向了调用函数的对象。 通俗的讲，就是谁调用了函数。 🐃 情况 1 this 指向 window 谁调用了这个函
阅读全文
摘要：不定参数 如何实现不定参数 使用过 underscore.js 的人，肯定都使用过以下几个方法： 这些方法都有一个共同点，就是可以传入不定数量的参数，例如，我想删除掉 array 中的 value1，value2 ，可以这样使用 , _.without(array,value1,value2); 那
阅读全文
摘要：介绍React.memo之前，先了解一下React.Component和React.PureComponent。 React.Component React.Component是基于ES6 class的React组件。 React允许定义一个class或者function作为组件，那么定义一个组件类
阅读全文
摘要：前言团队在使用react时，不断探索，使用了很多不同的css实现方式，此篇blog总结了，react项目中常见的几种css解决方案：inline style/radium/style component，只列举了团队项目中用过的一下实现方式，还有其他的不过多展开 css的不足样式与状态相关的情况越来
阅读全文
摘要：父组件： 子组件： github：https://github.com/Rossy11/re... 来源：https://segmentfault.com/a/1190000016992970
阅读全文
摘要：Redux Saga redux saga 是一个用于管理应用程序副作用（例如异步获取数据，访问浏览器缓存等）的javascript库，它的目标是让副作用管理更容易，执行更高效，测试更简单，处理故障更容易。 redux saga相当于一个放置在action与reducer中的垫片。 之所以称之谓副作
阅读全文
摘要：前言 Mobx是什么 安装 npm install mobx save 原则 一个简单的react+mobx的计算实例 小结 写的不详细，如有需要者，请前往官方文档 来源：https://segmentfault.com/a/1190000017026373
阅读全文
摘要：最新React全家桶实战使用配置指南 这篇文档 是吕小明老师结合以往的项目经验 加上自己本身对react webpack redux理解写下的总结文档，总共耗时一周总结下来的，希望能对读者能够有收获， 我是在这基础多些加工！ 目录 1.版本说明 2.目录结构 3.初始化项目 4.webpack 5.
阅读全文
摘要：注意：文章很长，只想了解逻辑而不深入的，可以直接跳到总结部分。 初识 首先，从它暴露对外的API开始 现在对它的大概工作范围有了解后，我们可以开始沿着执行顺序分析。 抽丝 Provider 我们使用时，当写完了redux的reducer, action, bindActionCreators, co
阅读全文
摘要：Context Context提供了除props之外的传参数的方式。 Context是全局跨组件传递数据的。 API React.createContext Provider Consumer Example ThemeContext.js ThemedButton.jsx App.js 在线示例
阅读全文
摘要：我们在项目中经常使用到下拉加载更多，之前要么是底部写加载按钮，要么是引入插件。今天终于有时间手写一个了，之前感觉挺麻烦，明白原理后，其实很简单... scrollTop：滚动视窗的高度距离window顶部的距离，它会随着往上滚动而不断增加，初始值是0，它是一个变化的值； clientHeight:它
阅读全文
摘要：本文是学习了2018年新鲜出炉的React Hooks提案之后，针对异步请求数据写的一个案例。注意，本文假设了：1.你已经初步了解hooks的含义了，如果不了解还请移步官方文档。（其实有过翻译的想法，不过印记中文一直在翻译，就是比较慢啦）2.你使用Redux实现过异步Action（非必需，只是本文不
阅读全文
摘要：工作中经常会遇到需要复制 JS 数据的时候，遇到 bug 时实在令人头疼；面试中也经常会被问到如何实现一个数据的深浅拷贝，但是你对其中的原理清晰吗？一起来看一下吧！ 为什么会有深浅拷贝 想要更加透彻的理解为什么 JS 会有深浅拷贝，需要先了解下 JS 的数据类型有哪些，一般分为基本类型（Number
阅读全文
摘要：在签到统计场景中，可以使用 bitmap 数据类型高效的存储签到数据，但 getbit 命令只能获取某一位值，就无法最优的满足部分业务场景了。 比如我们按年去存储一个用户的签到情况，365 天，只需要 365 / 8 ≈ 46 Byte，1KW 用户量一年也只需要 44 MB 就足够了。 但如果我想
阅读全文
摘要：<! TOC > 通俗易懂的设计模式 零、使用 1、安装 2、测试 一、什么是设计模式 二、设计模式的类型 三、设计模式的六大原则 四、UML类图 1、看懂UML类图 2、解释 五、资料 <! /TOC > 前言：花了一些时间再次熟悉了一遍设计模式，主要是参考design p
阅读全文
摘要：原文 RESTful API Design: 13 Best Practices to Make Your Users Happy 写在前面 之所以翻译这篇文章，是因为自从成为一名前端码农之后，调接口这件事情就成为了家常便饭，并且，还伴随着无数的争论与无奈。编写友好的 restful api 不论对
阅读全文
摘要：话说mui这个框架的UI确实挺好看的(个人觉得)所以项目使用了他,结果里面的坑太TM多,不得不说MUI做东西太不用心了,社区不活跃,提问都没人管!; mui第一个坑: 日期选择器默认值无效:使用代码跟踪找到里面实现的方法,里面方法确实没毛病,但是callback不会执行!比如设置日期选择器默认值;
阅读全文
摘要：简介 组件是可复用的 Vue 实例。 本质上是一个对象，该对象包含data、computed、watch、methods、filters以及生命周期钩子等成员属性。 组件结构： 基础知识 data属性 data属性维护一个组件内部状态，其余组件正常情况下不可见。 可以通过props传递给子组件； 可
阅读全文
摘要：当一个Vue的项目体积变得十分庞大的时候，使用Webpack的代码分离功能将Vue Components，routes或Vuex的代码进行分离并按需加载，会极大的提高App的首屏加载速度。 在Vue的项目中，我们可以在三种不同的情况下使用懒加载和代码分离功能： Vue组件，也称为异步组件 Vue R
阅读全文
摘要：一.前言 当打包构建应用时，Javascript 包会变得非常大，影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，这样就更加高效了。结合 Vue 的异步组件和 Webpack 的代码分割功能，轻松实现路由组件的懒加载. Vue 的异步组件 web
阅读全文
摘要：1.什么是scoped 2.scoped的实现原理 Vue中的scoped属性的效果主要是通过PostCss实现的。以下是转译前的代码: 转译后: 既:PostCSS给一个组件中的所有dom添加了一个独一无二的动态属性，给css选择器额外添加一个对应的属性选择器，来选择组件中的dom,这种做法使得样
阅读全文
摘要：今天，是有委屈的一天；今天，是有小情绪的一天。所以，我们要对今天进行小结，跟它做一个了断！ 今天，后端来一个接口，告诉我“要用post请求，parameter形式传参”。over。初级选手一般听到用post请求，但素用parameter传参一定很懵圈o((⊙﹏⊙))o。那么请先移步看这篇文章，get
阅读全文
摘要：一、前言 最近在做新vue项目的时候遇到了一个问题，就是tab间的切换没有问题，当跳转到其他页面时，且这个页面并非子路由，再用浏览器的返回按钮返回首页时，tab的active始终指向默认的第一个选项。 感觉这还是个比较常见的问题，但是在网上居然没怎么搜索到，自己摸索了一下，搞了一个解决办法出来。由于
阅读全文
摘要：背景 在本地开发vue项目的时候，当你习惯了proxyTable解决本地跨域的问题，切换到nuxt的时候，你会发现，添加了proxyTable设置并没有什么作用，那是因为你是用的vue脚手架生成的vue项目，它里面已经帮你写好了相关的proxyTable的设置代码。 build/dev server
阅读全文
摘要：Vue 页面的代码 axios接口 js部分调用封装的接口 在这里我并没有用form方式，而是将input隐藏，用label绑定input，当我们点击label的时候，也就点击了input 我将请求封装在了另一个文件里，为ChangeAvatar()函数，如果不封装，按常规写法一样是可以的 Form
阅读全文
摘要：1 什么是装饰器模式 向一个现有的对象添加新的功能，同时又不改变其结构的设计模式被称为装饰器模式（Decorator Pattern），它是作为现有的类的一个包装（Wrapper）。 可以将装饰器理解为游戏人物购买的装备，例如LOL中的英雄刚开始游戏时只有基础的攻击力和法强。但是在购买的装备后，在触
阅读全文
摘要：起步 HTML <script src="https://unpkg.com/vue/dist/vue.js"></script> <script src="https://unpkg.com/vue router/dist/vue router.js"><
阅读全文
摘要：vue+webpack环境，这里的that指到vue实例 一、图片压缩 二、base64转文件 这里后台接口不支持base64，根据实际接口情况使用 三、上传图片 / 图片上传接口 / imgRequest(param){ PostSaveImg( //封装的ajax（axios）方法 param
阅读全文
摘要：背景 在vue中使用jssdk微信分享 weixin js sdk mint ui需要安装npm install weixin js sdk mint ui save mixins/wechat.js 使用方法 import wxShare from '@/mixins/wechat' //引用 e
阅读全文
摘要：微信JS SDK选择图片遇到的坑 有个需求要在微信企业号里面做开发，有个功能是选择图片，使用input标签肯定是不管用了，Android手机上不能多选，所以使用了微信的JS SDK提供的相关API，这个地方真的是有坑，记录一下。按照文档直接引入js文件即可，如果使用的是Vue，也可以使用weixin
阅读全文
摘要：RebateBot 返利机器人 项目地址 微信聊天机器人 项目描述 关键词: 返利 微信 阿里妈妈 机器人 跨平台 返利机器人，基于微信建立机器人通道与用户通过聊天快速生成返利链接 利用闲置微信和极小的电脑性能开启24小时无人轮值返利机器人 购物只需要发送链接给机器人，机器人能马上给你回复优惠价格及
阅读全文
摘要：问题描述：如下代码所示，使用element ui 中的el form组件对table进行条件查询，当查询条件仅有一项时，使用@keyup.enter.native事件绑定回车事件，出现点击回车后，浏览器会刷新页面的问题； 搜索了问题触发原因，是由于当表单只有一个文本框时，按下回车将会触发表单的提交事
阅读全文
摘要：介绍 vue multi tab 是一套基于 vue 和 element ui 的 , 实现了 tab router (一个基于 tab 的路由) 的 单页面, 多页签 应用程序. 我之前写这个项目的时候,有写了一篇 记一次基于vue的spa多页签实践经验然后就部分热心网友就在下面回复了一些其他类似
阅读全文
摘要：修饰器 修饰器是一个 JavaScript 函数（建议是纯函数），它用于修改类属性/方法或类本身。修饰器提案正处于第二阶段，我们可以使用 babel plugin transform decorators legacy 这个 Babel 插件来转换它。 类修饰器 修饰器是一个对类进行处理的函数。类修
阅读全文
摘要：前言 本文纯属个人平时实践过程中的一些经验总结，算是一点点小技巧吧，不是多么高明的技术，如果对你有帮助，那么不胜荣幸。 本文不涉及罕见API使用方法等，大部分内容都是基于对vue的一些实践而已。由于涉嫌投机取巧，可能会带来一些不符合规范的副作用，请根据项目要求酌情使用。 多个页面都使用的到方法，放在
阅读全文
摘要：一 序言 在 传统Ajax 时代，进行 API 等网络请求都是通过XMLHttpRequest或者封装后的框架进行网络请求,然而配置和调用方式非常混乱，对于刚入门的新手并不友好。今天我们介绍的Fetch提供了一个更好的替代方法，它不仅提供了一种简单，合乎逻辑的方式来跨网络异步获取资源，而且可以很容易
阅读全文
摘要：公司项目需要，需要接入第三方支付，前前后后也搞了很久。虽然微信公众平台文档已经写得很清楚了，但是还是记录一下整个接入的流程。 openid openid是微信用户在公众号appid下的唯一用户标识（appid不同，则获取到的openid就不同,所以不同的公众号下有不同的openid,），可用于永久标
阅读全文
摘要：在解读Dep,Observer和Watcher之前，首先我去了解了一下Vue的数据双向绑定，即MVVM，学习于:https://blog.csdn.net/u013321...以及关于Observer和watcher的学习来自于：https://www.jb51.net/article/... 整体
阅读全文
摘要：vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。 安装、使用 vuex 首先我们在 vue.js 2.0 开发环境中安装 vuex : 然后 , 在 main.js 中加入 : 再然后 , 在
阅读全文
摘要：1 什么是 Jest? Jest是 Facebook 的一套开源的 JavaScript 测试框架， 它自动集成了断言、JSDom、覆盖率报告等开发者所需要的所有测试工具，是一款几乎零配置的测试框架。并且它对同样是 Facebook 的开源前端框架 React 的测试十分友好。 2 安装Jest 2
阅读全文
摘要：Vue.js 的各种指令（Directives）更加方便我们去数据驱动 DOM，例如 v bind、v on、v model、v if、v for、v once 等内置指令，这些指令的职责就是当表达式改变时将某些行为应用到 DOM 上，尽量不去操作增删改 DOM。通过了解如何去自定义指令，可以想象内
阅读全文
摘要：配置： 主域名 www.demo.xyz 二级子域名 api.demo.xyz 列表项目其中api.demo.xyz加入了版本控制，使用的是URL路由传入方式在route.php路由文件中配置，如下 项目最终目录结构为 nginx配置 关于nginx配置cors需要说明的一些问题 1.按照CORS
阅读全文
摘要：textarea自适应的实现方法很多，原理其实比较简单：监听textarea的input或者键盘事件，获取元素的scrollHeight,重置textarea元素的高度。 预览地址：textarea 我们知道textarea有个rows的属性，改变rows的值可以改变textarea的高度，至于怎么
阅读全文
摘要：1：vue 双向数据绑定的原理： Object.defineProperty是ES5新增的一个API，其作用是给对象的属性增加更多的控制Object.defineProperty(obj, prop, descriptor)参数 obj: 需要定义属性的对象（目标对象）prop: 需被定义或修改的属
阅读全文
摘要：【前端芝士树】 Vue.js 面试题整理 MVVM是什么？ MVVM 是 Model View ViewModel 的缩写。 Model代表数据模型，也可以在Model中定义数据修改和操作的业务逻辑。 View 代表UI 组件，它负责将数据模型转化成UI 展现出来。 ViewModel 监听模型数据
阅读全文
摘要：准备 利用vue cli脚手架创建项目 进入项目安装vuex、axios（npm install vuex,npm install axios） axios配置 项目中安装axios模块（npm install axios）完成后，进行以下配置： main.js loading组件 我这里就选择使用
阅读全文
摘要：首先定义一个全局样式： 创建一个dom.js文件，定义几个方法： 获取<html>标签的DOM： 在弹框弹出来的时候： 弹框关闭的时候 这样就可以解决滚动穿透的问题了~ 来源：https://segmentfault.com/a/1190000016481693
阅读全文
摘要：前言 像我们熟悉的 vue cli，create react app 等脚手架，只需要输入简单的命令 vue init webpack project，即可快速帮我们生成一个初始项目。在实际工作中，我们可以定制一个属于自己的脚手架，来提高自己的工作效率。 为什么需要需要脚手架？ 减少重复性的工作，不
阅读全文
摘要：为何有这篇文章 各个社区已经有无数篇帖子介绍如何使用webpack搭建前端项目，但无论是出于学习webpack的目的还是为了解决工作实际需要都面临着一个现实问题，那就是版本更新。别人的帖子可能刚写好版本就更新了，又要对着帖子找文档。 但这个过程十分重要，因为你想要的一切早已都在文档中给出了说明，在查
阅读全文
摘要：大家中秋假期快乐，假期分享一些实战文章给大家，原创不易，欢迎转发，一起学习 现在大家基本都在单页应用里面使用了 keep alive 来缓存不活动的组件实例，而不是销毁它们。 如果你还没有使用，可以看看官方的介绍（如果大家需要一些新手入门的文章可以留言哈）：https://cn.vuejs.org/
阅读全文
摘要：以下是我对vue观察者模式的理解:github L6zt 加入tip 2018 10 14 最近又看到《js设计模式设计》书 推荐去搂搂不要对框架的偏见, 你真的了解jquery、angular、react 等等，框架是什么只是工具而已。 你用过jquery的 trigger、on、off 事件绑定
阅读全文
摘要：Vue.nextTick浅析 Vue的特点之一就是响应式，但数据更新时，DOM并不会立即更新。当我们有一个业务场景，需要在DOM更新之后再执行一段代码时，可以借助nextTick实现。以下是来自官方文档的介绍： 将回调延迟到下次 DOM 更新循环之后执行。在修改数据之后立即使用它，然后等待 DOM
阅读全文
摘要：大家中秋假期快乐，假期分享一些原理设计文章给大家 原创不易，欢迎转发，一起学习(凌晨写的，不容易哈，收藏或者点个赞吧) 在常见的单页应用中，我们都会有一个根 App.vue 文件，里面放置一个 router view 然后配置路由来切换. 很多人在子父组件嵌套关系下的生命周期钩子函数如何应用，谁先谁
阅读全文
摘要：前言 公司系统在用elementui做后台开发，不免遇到一些需要自己去根据原有的功能上，加一些交互的功能。今天来介绍下我在用elementUi里的Tag标签与多选框交互的过程，东西听上去很简单，但就是越简单的东西越容易出一些问题。官方tag文档：elementUi tag标签 效果图： 思路 一、多
阅读全文
摘要：前言 最近在研究使用webpack的使用,在查阅了数篇文章后,学习了webpack的基础打包流程. 本来就可以一删了之了,但是觉得未免有点可惜,所以就有了这篇文章,供大家参考. webpack打包的教程具有时效性,有不少作者在一直维护一篇文章.超过一定时间参考价值就会下降,希望各位了解这一点. 使用
阅读全文
摘要：【自适应】向来是前端工程师需要解决的一大问题——即便作为当今非常火热的vue框架，也无法摆脱——虽然elementui、iview等开源UI组件库层出不穷，但官方库毕竟不可能满足全部需求，因此我们可以通过【监听窗口变化】达到想要的绝大部分自适应效果。 获取窗口宽度：document.body.cli
阅读全文
摘要：原文地址 对于没有了解过 vue cli3 的童鞋，建议先去看看官方的教程： 传送门 新版本的新特性 1. 插件 使用 cli 的插件，可以很快的搭建一个项目的结构。如 axios 的插件 vue cli plugin axios，可以自动创建一个带有 request 和 resonpose 的拦截
阅读全文
摘要：vue.js学习记录 文章已同步我的github笔记https://github.com/ymblog/blog，欢迎大家加star~~ vue实例 生命周期 beforeCreate：不能访问this.$el和this.$data用于初始化非响应式变量created：可以访问this.$data，
阅读全文
摘要：这是stackoverflow上一个关于python中yield用法的帖子，这里翻译自投票最高的一个回答，原文链接 here 问题 Python中yield关键字的用途是什么？它有什么作用？例如，我试图理解以下代码 ¹： 这是调用者(caller)： 当调用方法_get_child_
阅读全文
摘要：前言 在实现图片上传时，可能需要用到Upload，但是它默认的上传方式是加入图片后直接上传，如果要实现最后再一次性上传，需要自定义内容。 还有一个移除时调用的函数onRemove()，即点击上图的垃圾桶，这里没有定义。 利用Modal显示图片。 数据改变时直接重设fileList数组的值（我这里只有
阅读全文
摘要：好久没在 SegmentFault 写东西，唉，也不知道 是忙还是懒，以后有时间 再慢慢写起来吧，最近开始学点新东西，有的写了，个人博客跟这里同步。 一直都在自己的 React Native 应用中使用 Redux，其实更大情况下也是使用它来管理应用的会话状态以及当前登录的用户信息等等简单的数据，很
阅读全文
摘要：react 前端项目技术选型、开发工具、周边生态 声明：这不是一篇介绍 React 基础知识的文章，需要熟悉 React 相关知识 主架构：react, react router, redux, redux thunk, redux saga, react redux, dva, umi 扩展架构：
阅读全文
摘要：1. demo 如果你对下面的代码没有任何疑问就能自信的回答出输出的内容，那么本篇文章就不值得你浪费时间了。 2. 深入理解原始类型 原始类型有5个 Undefinded, Null, Boolean, Number, String 2.1. 原始类型变量没有属性和方法 原始类型中，有三个特殊的引用
阅读全文
摘要：这是本系列的第 4 篇文章。 作为 JS 初学者，第一次接触闭包的概念是因为写出了类似下面的代码： 给列表项循环添加事件处理程序。当你点击列表项时不会有任何反应。如何在初学就理解闭包？你需要接着读下去。 § 什么是闭包 说闭包前，你还记得词法作用域吗？ 执行上面的代码打印出 1。 bar 函数是 f
阅读全文
摘要：一、前期准备 安装好XAMPP软件，并运行起来。本文代码是基于XAMPP开发环境，XAMPP是完全免费且易于安装的Apache发行版，其中包含MariaDB、PHP和Perl。XAMPP开放源码包的设置让安装和使用出奇容易。 二、前后台数据交互 前台部分其中“process.php?name=Her
阅读全文
摘要：在今年年初的时候，完成了自己的个Fame博客系统的实现，当时也做了一篇博文Spring boot+Vue = Fame 写blog的一次小结作为记录和介绍。从完成实现到现在，也断断续续的根据实际的使用情况进行更新。 只不过每次上线部署的时候都觉得有些麻烦，因为我的服务器内存太小，每次即使只更新了前台
阅读全文
摘要：在使用vue和vue router开发spa应用时，我们会遇到这样一种问题。当页面跳转时，组件本身并没有发生改变： 这时我们进行路由跳转后会发现组件并没有刷新，在前一个路由组件的数据都保留了下来，这并不是我们想要的效果。 对于简单的数据更新，我们可以直接监听路由参数并重新获取路由的初始化数据即可，但
阅读全文
摘要：sticky简介 sticky的本意是粘的，粘性的，使用其进行的布局被称为粘性布局。 sticky是position属性新推出的值，属于CSS3的新特性，常用与实现吸附效果。 设置了sticky布局的元素，在视图窗口时，与静态布局的表现一致。 但当该元素的位置移出设置的视图范围时，其定位效果将变成f
阅读全文
摘要：项目简介 本组件是vue下的圆形进度条动画组件 自由可定制，几乎全部参数均可设置 源码简单清晰 面向人群 急于使用vue圆形进度条动画组件的同学。直接下载文件，拷贝代码即可运行。 喜欢看源码，希望了解组件背后原理的同学。刚接触前端的同学也可以通过本文章养成看源码的习惯。打破对源码的恐惧，相信自己，其
阅读全文
摘要：Vue 中需要输入什么内容的时候，自然会想到使用 <input v model="xxx" /> 的方式来实现双向绑定。下面是一个最简单的示例 JsFiddle 演示https://jsfiddle.net/0okxhc6f/ 在这个示例的输入框中输入的内容，会随后呈现出来。这是 Vue
阅读全文
摘要：新写的项目在 IE浏览器显示空白 解释一： 解释二： 解决方法： 原文：https://blog.csdn.net/lyn1772... 来源：https://segmentfault.com/a/1190000016688592
阅读全文
摘要：Vue事件修饰符 Vue.js 为 v on 提供了事件修饰符来处理 DOM 事件细节，如：event.preventDefault() 或 event.stopPropagation()。 Vue.js通过由点 (.) 表示的指令后缀来调用修饰符。 .stop.prevent.capture.se
阅读全文
摘要：需求 页面要做一个活动入口，不能太显眼，但是又要用户能一眼就看出来。 演示 https://jsfiddle.net/vtsxc18q/ 实现 （部分动画代码） Github 代码 https://github.com/lmxdawn/te... 另附一个 vue 搭建的后台管理 另附一个 vue
阅读全文
摘要：前言 大家好，这里是@IT·平头哥联盟，我是首席甩锅官——老金，今天给大家分享的，一些日常中神秘而又简单的vue的实用小技巧，以及我在我司项目中实用vue的总结和坑，跟大家一起分享，希望能给其他攻城狮带来些许便利，如有理解错误，请纠正。 技巧/坑点 1.setTimeout/ setInterval
阅读全文
摘要：有时候我们的vue组件需要复制使用者传递的内容。 比如我们工程里面的轮播组件需要使用复制的slot来达到循环滚动的效果 使用者关注轮播内容的静态效果，组件负责让其滚动起来 这种实现方式对于初始化的数据是没问题的，但是不支持slot内容的动态绑定，这是因为 vnode在vue中是唯一的 一个vnode
阅读全文
摘要：目前基本使用三款js代码质量检查工具： jslint, jshint, eslint。许多IDE里面也有对应的检查插件，在每次ctrl + s 保存文件的时候，检查当前文件是否符合规范，保证代码质量。许多团队都会指定一套代码规范code review,更加严格的检查每次代码修改。 也可以在git c
阅读全文
摘要：前言 前面两章已经介绍怎么开发一个chrome插件和怎么使用vue搭建一个弹出框的chrome插件，这一章来实现页面元素选择的功能，效果如下图，鼠标放到元素上，元素会高亮： 主要实现思路，创建一个和页面一样宽高的蒙层，监听蒙层的鼠标移动事件，再使用elementFromPoint函数来获得当前鼠标所
阅读全文
摘要：Vue源码探究 事件系统 本篇代码位于vue/src/core/instance/events.js 紧跟着生命周期之后的就是继续初始化事件相关的属性和方法。整个事件系统的代码相对其他模块来说非常简短，分几个部分来详细看看它的具体实现。 头部引用 头部先是引用了的一些工具方法，没有什么难点，具体可以
阅读全文
摘要：相关依赖 里面使用了vuex vue vue route storeJs storeJs 用来持久化vuex状态 展示 介绍说明 没有使用electron内置的 webkit app region: drag 因为使用他那个有很多问题比如事件无法使用 右键无法使用 以及不能使用手型等! 安装 安装的
阅读全文
摘要：之前本来想不写这个功能的,结果客户死活要qq登录! 实在没办法就写了,顺便写个文章!在写之前有两个问题:1: 打开qq授权页面点击页面中的链接会又打开一个页面! .....2: 授权之后是否成功很难去判断 不过脑海中有一个想法就是,electron就是一个类似于浏览器一样,既然是浏览器那肯定可以阻止
阅读全文
摘要：ajax plus 基于axios 的 Vue 插件 如何使用 npm 模块引入 首先通过 npm 安装 然后在入口文件引入并配置: 对标axios的配置，详见axios🚀 示例 $ajaxPlus方法 在 Vue 组件上添加了 $ajaxPlus 方法, 使用如下: 以上catchCb和fina
阅读全文
摘要：此文只介绍Async/Await与Promise基础知识与实际用到注意的问题，将通过很多代码实例进行说明，两个实例代码是setDelay和setDelaySecond。 tips:本文系原创转自我的博客异步Promise及Async/Await最完整入门攻略，欢迎前端大神交流，指出问题 一、为什么有
阅读全文
摘要：v model双向绑定数据 v html 能读取html标签 v class 类名 v text读取文本不能读取html标签 v show 显示与隐藏 v if显示与隐藏 （dom元素的删除添加 个人理解） v else v else if v bind v on 事件 v once执行一次事件 v
阅读全文
摘要：一、React (一)父组件向子组件传数据 简单的向下传递参数 在CodeSandbox中打开 向更下一级传递参数 在CodeSandbox中打开 (二)子组件向父组件传递参数 在CodeSandbox中打开 (三)兄弟组件传递参数 二、Vue (一)父组件向子组件传数据 简单的向下传递参数 在Co
阅读全文
摘要：在日常开发中，我们用的最多的就是 绑定数据 如果你有ng的开发经验，假设 data 你要更新数据了 但是这在vue中 并不会起到作用，DOM并没有触发变化。 vue不是已经实现的实时数据双向绑定，那么model层发生了变化之后，为什么view层没有更新呢？？？ 看官网 这里才发现 深入响应式原理 列
阅读全文
摘要：1.父组件给子组件传递数据 通过v bind动态绑定父组件中要传递的数据，子组件通过props属性接收父组件传递的数据。 2.子组件给父组件传递数据 自定义一个事件，在子组件中通过this.$emit()触发自定义事件并给父组件传递数据，在父组件中监听自定义事件并接收数据。 3.非父子组件之间的通信
阅读全文
摘要：如果能帮到你，点个赞吧，务必熟知的vuejs面试题「务必收藏」 vuejs 基础必备 1、active class 是哪个组件的属性？嵌套路由怎么定义 (1)、active class 是 vue router 模块的 router link 组件的属性 (2)、使用 children 定义嵌套路由
阅读全文
摘要：前言 vue split table应用的效果图 vue split table开源地址,欢迎star,现在已经开源和同步到npm上轻松搞定表格拆分或者合并,编辑,再也不怕被产品怼啦 1.核心源码分析 <td>里面嵌套<table>实现表格拆分; 原生实现复选框的单选和全选功
阅读全文
摘要：一、前言 当我们的应用遇到多个组件共享状态时，会需要多个组件依赖于同一状态抑或是来自不同视图的行为需要变更同一状态。以前的解决办法： a.将数据以及操作数据的行为都定义在父组件; b.将数据以及操作数据的行为传递给需要的各个子组件(有可能需要多级传递) 传参的方法对于多层嵌套的组件将会非常繁琐，并且
阅读全文
摘要：第一次写文章，写得不好各位看官见谅~ (pσ_σ)P首先这是一个vue里面的项目，高德地图api是直接CDN进来的，所以使用了global来调用，默认已经初始化了一个地图，为了实现一个输入框搜索功能和将搜索的结果清除掉，直观表现就是将搜索出来的点清除掉，话不多说直接上代码 接上，在高德地图的api中
阅读全文
摘要：思路分析 数据的双向绑定，就是数据变化了自动更新视图，视图变化了自动更新数据，实际上视图变化更新数据只要通过事件监听就可以实现了，并不是数据双向绑定的关键点。关键还是数据变化了驱动视图自动更新。 所有接下来，我们详细了解下数据如何驱动视图更新的。数据驱动视图更新的重点就是，如何知道数据更新了，或者说
阅读全文
摘要：步骤 创建 vue 的脚手架 绑定 git 项目 写组件 创建组件 src/components/xxx.vue 例如： 发布 代码参考 vue component popup 参考文档 Packaging Vue Components for npm Vue CLI 3 vue sfc rollu
阅读全文
摘要：一、前言 要学习vue router就要先知道这里的路由是什么？为什么我们不能像原来一样直接用标签编写链接哪？vue router如何使用？常见路由操作有哪些？等等这些问题，就是本篇要探讨的主要问题。 二、vue router是什么 这里的路由并不是指我们平时所说的硬件路由器，这里的路由就是SPA（
阅读全文
摘要：一、问题 vue中当用户提交表单时，有的数据需要去掉前后空格然后再向后端发送。 二、解决方法 首先可以使用v model.trim这个v model修饰符去解决它，但是当用户输入\u200B时，这个方法就不奏效了，这时我们可以去一下v model.trim这个修饰符的源码 function genD
阅读全文
摘要：①概述： 简单来说，假如父组件需要在子组件内放一些DOM，那么这些DOM是显示、不显示、在哪个地方显示、如何显示，就是slot分发负责的活。 ②默认情况下父组件在子组件内套的内容，是不显示的。 例如代码： 显示内容是一个button按钮，不包含span标签里面的内容； ③单个slot简单来说，只使用
阅读全文
摘要：Access_Token是调用微信和小程序各种接口的临时凭证，有效期2小时（7200秒），很多接口都需要调用access_token接口生成一个access_token的，例如微信支付，微信分享，公众号的开发，获取openid，获取用户的基本信息，群发接口，还有网页授权等各类接口都是需要access
阅读全文
摘要：前言 前一阵子忙着找工作,面试过程中,碰到一个感觉比较有意思的问题,尽量多的列举出新手引导动画的实现方式, 昨天稍微总结了一下, 实现了4种.源码在最后,如果想直接看结果的,可以拉到最后去看. 这里假设所有的弹出层都是基于页面上原有的元素 实现一 复制目标内容 具体步骤: 用 getBounding
阅读全文
摘要：前言 昨天写了新手引导动画的4种实现方式,里面用到了 html2canvas 于是就顺便了解了一下实现思路. 大概就是 利用 svg 的 foreignObject 标签, 嵌入 dom, 最后再利用 canvas 绘制 svg. 从而实现最终目的. 先让大家看看效果 MDN示例 MDN示例其实写的
阅读全文
摘要：最近写组件库的时后，发现这个滚动条是真的丑啊，决定重新撸一个滚动条： 首先咱们回顾一下移动端浏览器滚动条特性： 滚动条在开始滚动时渐显，滚动结束后渐隐 滚动条不占内容区宽度，悬浮固定 滚动条高度（深灰）和滚动区可视高度（浅灰）比等于滚动区可视高度和滚动目标的高度 当滚动目标的高度小于滚动区可视高度的
阅读全文
摘要：利用canvas将网页元素生成图片并保存在本地 注：createElementNS() 方法可创建带有指定命名空间的元素节点。 createElementNS(ns,name) createElementNS() 方法与 createElement() 方法相似，只是它创建的 Element 节点除
阅读全文
摘要：在开发中，有时会遇到像App中的手势那样的效果，下面就仿照App实现了一下。 wxml部分： wxss: js部分： json部分：
阅读全文
摘要：应用场景： 负责场景下的高性能 重用组件库，组件组合 中文官网：https://reactjs.org.cn/doc/in... 特点： 声明式编码(不需要关心如何实现，只需要关注在哪里做什么) 组件化编码 高效的DOM Diff，最小化页面重绘 单向数据流 创建一个新的app： 使用 Yarn 安
阅读全文
摘要：vue router的query和params的区别 首先简单来说明一下$router和$route的区别 $router为VueRouter实例，想要导航到不同url，则使用$router.push方法 $route为当前router跳转对象，里面可以获取name、path、query、param
阅读全文
摘要：在新版的Vue CLI 3中，如何导入公共less文件在文档里已经描述的很清楚了，但是在2. 的版本中，我没有查到相关的办法，网友的办法又相当复杂，于是我推荐给大家一个很简单的办法。 首先，会用到webpack中的资源预处理器Style Resources Loader，所以需要： 然后在build
阅读全文
摘要：在获取富文本后，又只要显示部分内容，需要去除富文本标签，然后再截取其中一部分内容；然后就是过滤器，在微信小程序中使用还是挺多次的，在vue及react中也遇到过 1.富文本去除html标签 去除html标签及 空格 截取字符串 2.vue中使用过滤器 3.微信小程序中使用过滤器 新建.wxs文件 使
阅读全文
摘要：src/core/instance/index.js此文件主要实现了Vue初始化 // 引入模块 import { initMixin } from './init' import { stateMixin } from './state' import { renderMixin } from '
阅读全文
摘要：最近无聊在搞一些新的东西，今天就遇到一个async/await的坑； 因为我用的不是vue官方的脚手架，所以遇到这样的问题： await is a reserved word 这样的警告，我猜应该是缺乏相关的解析器。 然后取掉await之后，又出现async出现问题： 好吧，只能google之。 查
阅读全文
摘要：背景 随着项目的成长，单页spa逐渐包含了许多业务线 商城系统 售后系统 会员系统 ... 当项目页面超过一定数量（150+）之后，会产生一系列的问题 可扩展性 项目编译的时间（启动server，修改代码）越来越长，而每次调试关注的可能只是其中1、2个页面 需求冲突 所有的需求都定位到当前git，需
阅读全文
摘要：点击详情跳转的时候，有时候有必要隐藏地址栏的必要参数，本次实验是通过sessionStorage存储 定时器刷新浏览器方式来实现的1.获取URL地址栏参数 及参数值 2.将必要参数缓存到sessionStorage中 3.重定向带有参数的地址 原文地址：https://segmentfault.co
阅读全文
摘要：本篇文章主要介绍了详解Nuxt.js Vue服务端渲染摸索，写的十分的全面细致，具有一定的参考价值，对此有需要的朋友可以参考学习下。如有不足之处，欢迎批评指正。 Nuxt.js 十分简单易用。一个简单的项目只需将 nuxt 添加为依赖组件即可。Vue因其简单易懂的API、高效的数据绑定和灵活的组件系
阅读全文
摘要：WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。WebSocket 使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在 WebSocket API 中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并
阅读全文
摘要：适用于vue的城市选择组件 仓库地址 基本功能： 支持全选、反选以及全部清空。 支持按拼音筛选。 勾选省份将会勾选省份下所有城市。 返回数据可灵活处理。 安装 用法 组件引入： 使用： 选择返回的数据： 属性 参数 说明 类型 默认值 placeholder 不说明 String 选择城市 本地运行
阅读全文
摘要：1. watch 与 computed 的巧妙结合 一个简单的列表页面。 你可能会这么做： 如果参数比较多 关键字筛选，区域筛选， 设备ID筛选， 分页数， 每页几条数据， 可能会是这样： 不过这么写，明显有问题，主要是 watch 了很多参数，而且函数的处理都差不多，可以修改一下，通过 metho
阅读全文
摘要：本篇文章主要介绍了vue配置请求本地json数据的方法，分享给大家，具体如下：在build文件夹下找到webpack.dev.conf.js文件，在const portfinder = require('portfinder')后添加 然后找到devServer，插入以下代码： 请求访问 最后重新启
阅读全文
摘要：这篇文章主要为大家详细介绍了vue全局组件与局部组件的使用方法，具有一定的参考价值，对此有需要的朋友可以参考学习下。如有不足之处，欢迎批评指正。 vue全局／局部注册，以及一些混淆的组件main.js入口文件的一些常用配置， 在入口文件上定义的public.vue为全局组件，在这里用的是pug模版
阅读全文
摘要：当我们在做接口请求时，比如判断登录超时时候，通常是接口返回一个特定的错误码，那如果我们每个接口都去判断一个耗时耗力，这个时候我们可以用拦截器去进行统一的http请求拦截。 1.安装配置axios 我们可以建一个js文件来做这个统一的处理，新建一个axios.js，如下 然后在main.js中引入这个
阅读全文
摘要：然后就是将全景图显示在页面上 这样全景图就能顺利加载出来了，第一次做前端知识分享，有不妥之处欢迎留言，谢谢！ 原文地址：https://segmentfault.com/a/1190000017292935
阅读全文
摘要：v model 指令在表单控件元素上创建双向数据绑定,所谓双向绑定，指的就是我们在js中的vue实例中的data与其渲染的dom元素上的内容保持一致，两者无论谁被改变，另一方也会相应的更新为相同的数据 <body> <div class="app"> </div>
阅读全文