my__road的博客

原创 mac管理多个node

1、打开终端，安装nvm curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.6/install.sh | bash2、配置环境，输入command -v nvm，输出nvm，代表安转成功export NVM_DIR="$HOME/.nvm"[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh"3、nvm基础命令nvm list //查看已安..

原创 数据结构简记

1、数组数组是一种最简单最常用的数据结构，栈和堆皆由其衍生而来。每个数组的元素位置以数字编号成为下标或者索引，从0开始计算。根据数组的维度来区分可以分为一维数组、多维数组。将多维数组变为一维数组称为数组扁平化，下面列举几种数组扁平化的方式1.使用reduceconst arrList=[[1,2],[3,4],[[5,6],[7,8]]];const recur=(arrList)=>{return arrList.reduce((pre,cur)=>{ re

原创 antd form表单使用的踩坑历程

'Instance created by `useForm` is not connect to any Form element.' nameList.map is not a function

原创 使用XMLHttpRequest（）实现上传下载

上传图片和文件是我们工作中常常遇到的问题，因此特此记录一番。多说无益上干货。1、上传文件const xhr =new XMLHttpRequest();xhr.open('post','地址');const data = new FormData()data.append('file',file)xhr.setRequestHeader('Authorization',`Bearer ${token}`)xhr.send(data)xhr.onload = () => {

原创 git 打标签

通常打标签的操作在正常commit之后git tag -a v0.0.1 -m "v0.0.1"-a之后是标签的名字 -m之后是对此标签的注释打完标签后我们再提交到本地仓库去git push origin --tags切换到指定的taggit tag list //显示已有的tag列表git checkout tag名字删除taggit tag -d v0.0.1删除远程分支上面的taggit push origin :refs/tag/v0.0.1

原创 面试题之HTML篇（一）

一第一篇章：HTML1、对html语义化的理解html语义化让页面的内容结构化，结构更加清晰。便于浏览器、搜素引擎解析。即使在没有css的情况下也以一种文档格式显示，容易阅读。搜素引擎的爬虫也依赖于HTML标记来确定上下文和各个关键字的权重，利于SEO。使得阅读代码的人更容易将网站分块，便于阅读维护。2、title和alt属性的区别是什么？alt是给搜索引擎识别，在图像无法显示时的替代文本。title是关于元素的注释信息，主要是给用户解读。ps：在IE中alt也起到了title的作用，变成了文

原创 npm ERR! code EEXIST与create-react-app : 无法加载文件 C:\Users\ASUS\AppData\Roaming\npm\create-react-ap报错解决

今天想创建一个react脚手架来玩一玩，不同于以往在C盘，今天想要在F盘里新建，于是我敲下了这样一行代码： npm install -g create-react-app，不出意外他报错了，原因是因为我的C盘已经安装过create-react-app了。解决这个问题很简单，敲下了npx create-react-app，很好成功了接下来就是创建了，create-react-app my-app，好家伙，直接又报错，这个时候打开Windows PowerShell以管理员身份运行先输入set-Exec

原创 React的tableData更新，table不重渲染

这是不更新的列子handleDelete = val => { let { tableData } = this.state; tableData.map((item, index) => { if (item.userId === val) { tableData.splice(index, 1); } return item; }); this.setState({ tableData,

原创 react-cookie

安装cookie.jsnpm i js-cookie -s导入cookieimport Cookies from ‘js-cookie’使用cookie存字符串：Cookie.set('key','value')取字符串：Cookie.get('key')存json对象:Cookie.set('person',{'name':'Jack','age':'18'})取json对象:Cookie.getJson('person')删除对象:Cookie.remove.

原创 react使用axios，配置代理

1、安装axiosnpm i axios -s2、新建utils文件夹，新建request.js文件import axios from 'axios'import {getToken} from './auth'const instance = axios.create({ baseURL:'/api', timeout:50000})instance.defaults.headers = { 'Authorization':'Basic cGxhdGZvcm1f

原创 什么是跨域？跨域的解决办法

一、什么是跨域因为浏览器处于安全考虑，防止 CSRF 攻击，引入了同源策略这个概念。也就是说，没有同源策略的情况下，A 网站可以被任意其他来源的 Ajax 访问到内容。如果你当前 A 网站还存在登录态，那么对方就可以通过 Ajax 获得你的任何信息，简言之，有了同源策略，坏人就无法获取到用户的信息，但是总不可能因为一部分坏人而让所有好人拿不到信息吧，因此就有了跨域。也就是说，如果协议、域名或者端口有一个不同就是跨域，Ajax 请求会失败。然后我们来考虑一个问题，请求跨域了，那么请求到底发出去没有？.

原创 mobx的使用方法

废话不多说直接上干货！！npm下载mobx在终端输入以下代码npm install mobx@5.15.4 mobx-react@6.3 -s在src文件夹里面新建一个store文件夹，并建立两个js文件，我这里建的是index.js和store1.js在store1中写入import { observable, action } from 'mobx';class UseStore { @observable user = 1; @action login() {

原创 react 装饰器的使用

要是用装饰器首页我们得安装一些插件1、npm run eject2、npm install --save-dev @babel/plugin-proposal-decorators这个时候运行npm run start 会出现react is not defined的错误，解决这个错误我们可以通过配置package.json里面的babel来解决，配置文件在此附上"babel": { "plugins": [ [ "@babel/plugin-proposal-d

转载 原生js插件（超详细）

作为一个前端er，如果不会写一个小插件，都不好意思说自己是混前端界的。写还不能依赖jquery之类的工具库，否则装得不够高端。那么，如何才能装起来让自己看起来逼格更高呢？当然是利用js纯原生的写法啦。以前一直说，掌握了js原生，就基本上可以解决前端的所有脚本交互工作了，这话大体上是有些浮夸了。不过，也从侧面说明了原生js在前端中占着多么重要的一面。好了。废话不多说。咱们就来看一下怎么去做一个自己的js插件吧。插件的需求我们写代码，并不是所有的业务或者逻辑代码都要抽出来复用。首先，我们得看一下是否需要将一

原创 如何使用nodejs搭建服务器

之前的配置什么的就不说了，配置好后，进入下面步骤搭建服务器一:进行初始化在命令行使用npm init命令进行初始化界面，初始成功后，你可以看到有你的文件中会出现一个package.json的文件，证明你初始化成功二：下载需要的模块这里我就先把我后面需要的模块下载了以下就是我的下载命令npm install express@4 morgan serve-favicon body-parser express-session cookie mysql ejs -s三：引用并配置这些模块c

转载 new FileReader()

一、调用FileReader对象的方法 方法名 参数 描述 abort none 中断读取 readAsBinaryString file 将文件读取为二进制码 readAsDataURL file 将文件读取为 DataURL readAsText file, [encoding] 将文件读取为文本readAsText：该方法有两个参数，其中第二个参数是文本的编码方式，默认值为 UTF-8。这个方法非常容易理解，将文件以文本方式读取，读取的结果即是这个文本文件中的内容。**readAsBi

原创 ES6学习-----symbol

在ES6中引入了一种新的原始数据类型symbol，表示独一无二的值。它是JavaScript语言的第七种数据类型，是一种类似于字符串的数据类型symbol的特点symbol的值是唯一的，用来解决命名冲突的问题symbol的值不能与其他数据进行运算symbol定义的对象属性不能使用for in来进行遍历，但是可以使用reflect.ownkeys来获取对象的所有键名let s=Symbol(); console.log(s,typeof s)//Symbol() "symbol"//

原创 ES6学习---------rest参数

什么是rest参数呢？ES6引入rest参数（形式为“…变量名”），用于获取函数的多余参数。rest参数之后不能再有其他参数（即只能是最后一个参数）。ES5写法function fn() { console.log(arguments) } fn("禹司凤","褚璇玑","昊辰")结果，是一个对象而不是数组ES6的写法 function f(a,b,...args) { console.log(a)//1 console.lo

原创 特殊字符表

原创 css——浮动与清除浮动的五种方法

学习浮动首先我们要先清楚一个概念——文档流。那么什么是文档流呢？文档流是文档中可显示对象在排列时所占用的位置。简单来说就是从头到尾按照文档的顺序，该在什么位置就在什么位置，也可以按照上面的意思理解，自上而下，自左到右的顺序。而今天学习的float就是使得元素脱离文档流从而达到我们想要的效果的方法之一。首先先来一个正常的文档流：<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <

转载 css选择器与权重问题——三、权重问题

除了浮动之外，css权重问题是你要了解的，最复杂的一个概念之一。css每条规则权重的不同，是你所期望的效果，没有通过css规则在元素上生效的主要原因。为了减少调试bug的时间，你需要了解浏览器是怎样解析你的代码的。为了完成这个目标，你需要对权重是如何工作的，有一个清楚的认识。很多Css出现问题的场景，都是某处定义了一个更高权重的规则，导致此处规则不生效。Css权重问题并不简单，而且有很多或具体或抽象的理论来解释这个问题。本文也将探讨这个问题，我相信如果你喜欢星球大战的话你肯定会理解这些概念的~我们将会讨

原创 css选择器与权重问题——二、css的四种引入方式与复合选择器

上一篇忘记写css的四种引入方法了，在这里补充出来。css的四种引入方式1、外联<link rel="stylesheet" href="day4-1.css">2、内联<h1 style="color: blue">我是h1</h1>3、内嵌<style> h1{ color: brown; }</style>4、导入<style> @import "day4-1.cs

原创 css选择器与权重问题-----------一、四种基本选择器

css选择器1、标签选择器标签选择器选择的是整个html页面所有包含这个标签的元素，经常用于描述共性，没办法特殊的选择改变某一个元素例如：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>css选择器</title> <style> p{ color: blue;

原创 HTML表单详解（二）

日期<input type="date" name="" id="date">效果： <input type="datetime-local" name="" id="date">效果：电子邮件<input type="email" name="" >效果：提交文件<input type="file"><input type="week" name="" >...

原创 HTML表单详解（一）

form<form method="post"(规定如何发送表单，常用值get/post) action="result.html">(表示向何处发送表单数据)</form>文本框 <label for="username">用户名</label> <input type="text" id="username">注：label元素不会向用户呈现任何特殊效果。但若label标签for属性与相关元素的id值相同的话，点击la

原创 HTML初始

HTML初识一HTML5、HTML4、XHTML的区别标签一些标签的效果展示表格表格的练习效果展示第一次就写一些关于HTML的入门小点点吧！！！一HTML5、HTML4、XHTML的区别HTML5与HTML4相比有以下几点区别语义化：HTML5相比于HTML4增加了更多的语义化标签比如：header、nav、section、article、footer等新标签，更好的组织了文档的结构，减少了div的使用更加关注于组织，HTML5废除了如b、strong等标签的使用，将这些工作都交给css去做，使