自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

MIR_zhang的博客

前端学习

  • 博客(29)
  • 收藏
  • 关注

原创 webpack4 搭建 Vue 开发环境笔记

一、node 知识__dirname: 获取当前文件所在路径,等同于 path.dirname(__filename)console.log(__dirname);// Prints: /Users/mjrconsole.log(path.dirname(__filename));// Prints: /Users/mjrpath.resolve([…paths]): 把一个路径或路...

2018-11-14 09:43:24 3060

翻译 Tasks(任务), microtasks(微任务), queues(队列) and schedules(回调队列)

原文:What is the Execution Context & Stack in JavaScript?git地址:Tasks(任务), microtasks(微任务), queues(队列) and schedules(回调队列)如果你更喜欢视频,Philip Roberts 在 JSConf 上就事件循环有一个很棒的演讲——没有讲 microtasks,不过很好的介绍了其...

2018-09-26 15:20:28 1899

翻译 JavaScript中的执行上下文和队列(栈)的关系?

原文:What is the Execution Context & Stack in JavaScript?git地址:JavaScript中的执行上下文和队列(栈)的关系?导读:以前总是看到相关文章提到什么变量提升,函数提升啥的,什么函数提升优先级大于变量的,总是知其然,不知其所以然,当面试官拿着同一name,却不断function, 和var赋值,然后让你告诉他每一个阶段该是什...

2018-09-26 15:01:19 512

原创 vue服务器渲染nuxtjs

但是

2018-08-07 09:24:14 3783

原创 vue预渲染--prerender-spa-plugin插件的使用

预渲染 我们按照vue-cli脚手架开发的vue项目,打包后是一个空的html和一些js、css,在浏览器拿到这些资源后就会根据js去请求数据、生成dom然后再插入html,这种就浏览器渲染,由于这种方式无法解决seo,而且白屏时间偏长导致对应的体验不佳,便有了预渲染和服务器渲染。demo三种不同渲染方式的区别:客户端渲染:用户访问 url,请求 html 文件,前...

2018-08-07 09:19:29 4808

原创 vscode设置同步

1、Settings Sync是vscode中同步设置和安装插件的小工具,在扩展商店中搜索并安装它 2、登陆Github>Your profile> settings>Developer settings>personal access tokens>generate new token,输入名称,勾选Gist,提交 3、保存Github Access Tok...

2018-07-23 16:59:46 2380

原创 Windows10安装Linux子系统Ubuntu,使用tree指令生成文件目录结构树

我们经常需要将一个文件生成为目录结构树,我们可以通过win 提供的tree指令来搞定。 win系统里的tree指令: 在cmd种输入tree /?C:\Users\zhang\Desktop\work>tree /?以图形显示驱动器或路径的文件夹结构。TREE [drive:][path] [/F] [/A] /F 显示每个文件夹中文件的名称。 /A 使用...

2018-06-21 18:20:55 2086 1

原创 react-native学习中问题汇总

问题描述:creact-react run-android时报错: Could not get unknown property ‘MYAPP_RELEASE_STORE_FILE’ for SigningConfig_Decorated 截图: 参考:传送门

2018-06-03 01:14:28 202

原创 结合享元模式思想写一个导航

享元模式:运用共享技术有效的支持大量的细粒度的对象,避免对象间拥有相同内容过多造成多余的开销在写管理端时,一般会做权限控制,这时我们就要根据后台返回的权限树(或者相应数组)生成对应的导航菜单在这里我们通过享元模式来基于react和antd来根据权限树来生成对应的菜单 MenuItem元和SubMenu元:const renderMenuItem = ({ path, name, ...

2018-06-01 00:17:19 244

原创 中介者模式

在学习javascript设计模式一书中,看到了这样一个需求: 需求要求给导航消息提示部分加个用户自定义消息提示设置,而问题是很多模块都导航,这样一个一个模块去改导航就太麻烦了,所以用到了中介者模式虽然在vue项目中我们可以用vuex统一管理,但是这种思想还是很有必要理解的中介者模式与发布订阅模式的区别就是: 中介者:消息在一处发布,用户只能订阅,可以通过微信公众消息推送模式理解 发...

2018-05-31 23:10:12 175

原创 发布订阅模式简单实现

代码export default class Oberver { // 定义一个事件容器 event = {} subscribe (type, fn) { // 消息类型不存在 if (typeof this.event[type] === 'undefined') { this.event[type] = [fn] // 存在,将fn推...

2018-05-31 01:05:59 5233 1

原创 vue如何实现一个auto-complete组件

在这里提供种实现auto-complete组件的思路 auto-complete的静态页面 一、通过vue指令来实现auto-complete<template> <div> <div class="search"&a

2018-05-26 00:44:33 18175 1

原创 在window下搭建react-native开发环境配置,并通过react-native-cli生成一个项目运行

安装些基本软件,自行找教程,记得配置下环境变量安装python2安装jdknode、yarn(https://blog.csdn.net/bule_zst/article/details/78157361)模拟器Genymotion传送门安装android studio然后看着教程将SDK装好传送门配置下环境变量在...

2018-05-21 01:56:33 3925

原创 npm设置淘宝镜像

一、通过config命令npm config set registry https://registry.npm.taobao.org 这种方式有点问题,通过config命令方式会导致在npm install时报一个配置文件错误,看不懂,最后重装了使用直接修改配置文件的方式二、通过编辑(C:\Program Files\nodejs\node_modules\npm)npmrc 文...

2018-05-20 00:30:12 1686

原创 git 将本地已有项目上传至github

git init把这个文件夹变成Git可管理的仓库指定仓库地址 git remote add origin ‘xxx.git’提交注释 git add * git commit -m ‘init’此时会提示输入用户名和密码git push origin master...

2018-05-10 11:46:03 158

原创 如何在react里用stylus

首先,将crecte-react-app生成的项目的配置文件暴露出来yarn run eject然后就可以看到config配置文件,在这里将开发环境的的文件加上stylus-loader 嗯,就这样,记得生产环境的配置文件也加上一波。 然而,这个postcss-loader又是哥什么鬼,git上搜索一波,postcss,挺强悍的,就是个平台啊,原来autoprefixer这玩意就是...

2018-05-05 22:38:16 1775

原创 parentNode、parentElement,childNodes、children 区别

parentElement 获取对象层次中的父对象。 parentNode 获取文档层次中的父对象。 childNodes 获取作为指定对象直接后代的 HTML 元素和 TextNode 对象的集合。 children 获取作为对象直接后代的 DHTML 对象的集合。parentNode和parentElement功能一样,childNodes和children功能一样。但是p...

2018-04-26 11:33:48 2287

原创 一些比较巧妙的css用法

nth-of-type(1)和‘+’选择器排除第一个元素的样式比如一个很常见的需求:对以下li(除第一个外)加样式margin-left:10px<ul class="ul"> <li class="ul__li"></li> <li class=&quot

2018-04-12 10:56:12 244

转载 四种常见的 POST 提交数据方式对应的content-type取值

四种常见的 POST 提交数据方式对应的content-type取值application/x-www-form-urlencoded 这应该是最常见的 POST 提交数据的方式了。浏览器的原生 form 表单,如果不设置 enctype 属性,那么最终就会以 application/x-www-form-urlencoded 方式提交数据。请求类似于下面这样(无关的请求头在本文中都省略掉...

2018-04-11 10:32:07 1485

原创 js基本类型和引用类型

js数据类型可以分为基本类型和引用类型:基本类型的值源于以下5种基本数据类型:Undefined、Null、Boolearn、Number、String*基本类型值在内存中占据固定大小空间,因此保存在栈内存中 *从一个变量向另一个变量复制基本类型,会创建这个值的一个副本确定一个值是哪种基本类型可以使用typeof操作符 typeof返回值对应表:Undefine...

2018-04-11 10:19:32 131

原创 vue中使用px2rem

在这里首先要说明下rem是什么? rem是相对于根元素的字体大小的单位px2rem安装yarn add px2rem在utils中增加px2remLoader 看看里面的配置项option是些什么吧Usage: px2rem [options] <file...> Options: -h, --help ...

2018-04-03 10:18:03 5447 3

原创 vue有时间了解内容

了解下next()的原理beforeRouteEnter(to, from, next){ next(vm=>{ console.log(vm.testData) vm..$store.dispatch('xxx','data yyy') }) }了解下router.app// vue-router 里面可以通过...

2018-03-31 00:00:56 104

原创 React消息传递

React消息传递 在React中,数据流动是单向的(单向数据流),父组件通过props将数据传递到子组件,子组件根据父组件传递来的属性和组件内部状态来确定如何渲染。因为单向数据流的特性,父组件向子组件传递数据是很容易的,即通过props传递数据,且子组件不能修改自己的props;父组件向孙子组件或者后代组件传递数据同样可以利用props进行层层传递。但是,开发过程中我们会遇到各种各样的情况,譬...

2018-03-30 23:23:51 801

原创 react组件问题

1、react的组件中的super(props)是干啥的 a、调用super的原因:在ES6中,在子类的constructor中必须先调用super才能引用this,这是因为子类没有自己的this对象,而是继承父类的this对象,然后对其进行加工,如果子类没有定义constructor方法,这个方法会被默认添加:es6入门 b、super(props)的目的:在constructor...

2018-03-30 22:02:03 220

原创 koa 快速模拟后台接口

在前后端同步开发的过程中,前期后台接口出的没那么快,前端一般可以自己模拟接口—前提时与后台约定好数据格式首先安装个koa脚手架npm install koa-generator -gkoa生成一个server目录并安装依赖koa2 server && cd server&& yarn新建个假数据目录mkdir mock目录 ...

2018-03-23 00:47:24 2992 1

原创 react-router

模板方式(link方式)import { link } from 'react-router' <link to="/detail">link方式</link>编程式(js方式)import { hashHistory } from 'react-router'clikHandler (value) { hashHistory.push(`det...

2018-03-22 23:21:08 158

原创 es6实用方法

数组去重 Set 结构不会添加重复的值[...new Set(arr)] Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括 ES6 新增的数据结构 Set 和 Map)Array.from(new Set(arr))去重排序[...new Set(arr...

2018-03-21 12:00:57 126

原创 vue父子组件通信

父子组件通信父组件<div id="prop-example-2"> <child :string="string" :obj="obj" :name.sync="name" @changStrin

2018-03-14 11:40:00 146

原创 如何使用vuex

vuex学习笔记小项目中 小项目中不可能有太多状态需要vuex管理,在store.js中不需要做分类处理const store = new Vuex.Store({ state: {}, mutations: {}, getter: {}, action: {}})export default store在.vue文件中使用import {...

2018-03-13 18:17:10 223

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除