YuHo Blog

Graphql 从入门到真香

背景当谈起 API 设计时，人们首先会想到 REST API，它是 Representational State Transfer 的缩写。REST API 是标准化的工具，它通过 URL 的方式从服务器上获取数据。 REST 架构的设计范式侧重于分配 HTTP 请求方法（GET、POST、PUT、PATCH、DELETE）和 URL 端点之间的关系。RESTful API 设计指南......

Posted by YuHo Wang on 2020-08-12

Graphql

从 try catch 学习 JS Event Loop

先看一道题以下代码输出什么？为什么会这样报错？ 12345try { (async function() { a().b() })()} catch (e) { console.log(`错误信息：${e.message}`)} 3, 2, 1… 揭晓答案：很明显，错误并没有被捕获，而是直接在控......

Posted by YuHo Wang on 2020-06-08

JavaScript

解决图片加载 403 错误（防盗链）

问题 html 中通过 img 标签引入图片地址，报 403 错误，而这张图片的地址单独复制出来在浏览器是能打开的。如下图：解决方案在页面 head 头部添加下面这行代码： 12<meta name="referrer" content="no-referrer"> 原因 http 请求......

Posted by YuHo Wang on 2020-03-17

HTTP

npm 语义化版本规范整理

每个项目的根目录下都有一个 package.json 文件，定义了这个项目所需的各种模块，以及项目的配置信息。其中，dependencies 字段指定了项目运行所依赖的模块，devDependencies 指定项目开发所需要的模块。语义化版本管理 dependencies 和 devDependencies 都指向一个对象。该对象的各个成员，分别由模块名和对应的版本要求组成，表示依赖的......

Posted by YuHo Wang on 2019-10-03

扩展 create-react-app 项目中的 webpack 配置

create-react-app 生成的项目对 webpack 的配置进行了封装并默认隐藏，但大多数时候我们需要扩展项目的 webpack 配置。此处以配置 less-loader 为例，演示如何扩展 create-react-app 的 webpack 配置，有以下两种方式：一、使用react-app-rewired 安装 12yarn add react-app-rewired cu......

Posted by YuHo Wang on 2019-08-12

React

pm2 启动 http-server 静态服务器

http-server http-server 是基于 node.js 的一个简单、零配置的命令行web服务器，用来做静态服务器非常方便。相关介绍可参考：https://blog.csdn.net/ithanmang/article/details/88375259 常规使用方法是在根目录下运行命令： 1http-server <path> -a 127.0.0.1 -p &l......

Posted by YuHo Wang on 2019-07-10

Node pm2

react 项目中引入图片的几种方式

引用本地图片导入图片路径 12import Img from './images/1.png'<img src={Img} alt='' /> 直接获取图片 1<img src={require("./images/1.png")} alt=""> 导入背景图 css 中用正常 css 语法 123.img ......

Posted by YuHo Wang on 2019-05-27

React

element-ui table 树型结构每次只展开一行

最近做的项目需要用到表格展开下钻，产品要求每一行展开，其他行收起，类似手风琴效果。 element-ui table 并没有类似的功能，但是根据官方文档给出的 table 的一些 api，进行组合一下，还是能实现这个功能的。直接上代码了： 1234567891011121314151617181920212223242526272829303132333435363738394041424......

Posted by YuHo Wang on 2019-05-22

Vue Element-ui

deep 深度选择器与修改 element-ui 样式

Scoped Css 当 <style> 标签有 scoped 属性时，它的 CSS 只作用于当前组件中的元素。这类似于 Shadow DOM 中的样式封装。它通过使用 PostCSS 来实现以下转换： 123456789<style scoped>.example { color: red;}</style><template......

Posted by YuHo Wang on 2019-05-15

Vue CSS Element-ui

await 与 Promise.all 结合使用

当遇到多个可以同时执行的异步任务时，就需要使用 Promise.all。 Promise.all 方法用于将多个 Promise 实例，包装成一个新的 Promise 实例。 1const p = Promise.all([p1, p2, p3]) Promise.all 方法接受一个数组作为参数，p1、p2、p3 都是 Promise 实例，如果不是，就会先调用 Promise.resol......

Posted by YuHo Wang on 2019-05-14