2021年03月_gaearon

原创 react 解决跨域问题

<p>react 仅仅关注数据本身，没有发起网络请求的功能，需要借助 ajax 发起数据请求，推荐使用 axios</p><p>使用 react 做开发，开放模式往往是前后端分离，如果后端没有配置允

2021-03-29 15:28:00 4665 6

不仅仅是 “蚂蚁牙黑” 特效，还有比如 “让老照片动起来”，都可以做。我不生产代码，我只是 GitHub 的搬运工。????GitHub 仓库地址：https://github.com/dunnousername/yanderifier所需文件我都已经放到了百度网盘：ffmpeg-win32-v3.2.4：https://pan.baidu.com/s/1H6oDH3Nr0j1X84CtC43Giw提取码：nuijyanderify：https://pan.baidu.com/s/1fcdszj

2021-03-28 16:29:51 3196

原创 koa2 洋葱模型

示意图koa2 是基于 async 和 await 实现的，使用 next 进行流程控制。这样就可以使用 await next() 进行一种特殊的执行顺序，等下一个路由执行完毕之后，再执行当前路由，通常称为 “洋葱模型”。何谓 “洋葱模型”就像那首歌一样，“一层一层剥开我的心”，koa2 中的 “洋葱模型” 也是这样，匹配到的路由，可以一层一层进去，进入最内层之后，再一层一层出来。例如这个 demo：api.get("/", async function (ctx, next) { cons

2021-03-19 17:50:33 637

原创 koa2 快速入门

简单说说 koa2koa2 是由 express 的原班人马开发的，koa 框架有两个版本：koa 和 koa2。koa 使用 ES6 的 generator 来编写的，当 node 引擎支持 ES7 之后，koa 的创始人立即使用 async 和 await 重构了 koa 框架，就有了现在的 koa2。所以，下文中下载 koa2 的脚手架工具时，下载的是 koa....（详见下文）。脚手架和基础配置脚手架koa2 提供了脚手架工具，可以用来更好的创建 koa2 项目。npm 下载地址：ht

2021-03-18 09:18:08 5452

原创 let that = this 重要性

阅读其他人代码的时候，可能会遇到这样一段代码let that = this不要小看这段话，作用大了去了。原因是：this 会随着上下文环境而变换它的指向，在当前作用域中设置一个变量用来存储 this 可以防止在其他地方找不到 this 的错误。...

2021-03-14 20:54:55 1079 1

原创 React 数据和事件绑定

数据绑定与事件初探上文说到，jsx 为元素设置属性，需要使用 jsx 的属性，可是想要修改属性有点难受。这样绑定属性和 vue 相比就太垃圾了。jsx 可以采用类的方式定义组件，在 constructor 中定义渲染页面时需要的数据。jsx 可以一个组件为一个对象，结合了面向对象编程的思想。如下代码所示：import { Component, Fragment } from "react";class app extends Component { render() {

2021-03-12 00:55:20 349

原创 React 组件和 JSX 语法

React 组件React 组件和 Vue 组件没啥区别，都是将局部的代码封装到一个新的文件中，这样可以使代码易于维护。下载 React 扩展可以在 vscode 中快速生成一个新的 React 组件：常用快捷键：imr：自动导入 Reactimrc：自动导入 React 和 Componentcc：生成无 constructor 的组件类，并导出ccc：生成包含 constructor 的组件类，并导出。更多快捷键：https://blog.csdn.net/qq_39721418/

2021-03-12 00:48:05 369

原创 React 开发环境搭建

react 官方网站https://reactjs.org使用 react 脚手架创建项目脚手架工具，例如 webpack、gulp、vue-cli 等。react 像 vue 一样提供了自己的脚手架工具，Creata React App。官网中给出了示例：https://zh-hans.reactjs.org/docs/create-a-new-react-app.htmlnpx create-react-app my-appcd my-appnpm start上述命令，会自动创建 m

2021-03-12 00:41:36 131

原创使用 nodejs + express + layui 搭建的个人博客

采用 mvc 架构项目地址：https://gitee.com/keepess/blog记得安装依赖

2021-03-10 11:46:36 921 2

原创【vscode插件集】学前端一年，珍藏的 40个 vscode 插件

猿生不能只有 Ctrl + C 和 Ctrl + V，还要有 Ctrl + D。工欲善其事，必先利其器。今天给大家带来了博主学习前端一年多以来偷懒，呸~ 提升效率必备的 40 个 vscode 插件。看完觉得有帮助的记得点个赞~HTML 标签自动闭合 – Auto Close Tag身为一个前端程序猿，打 HTML 标签那必须是快速的，vscode 本身就提供了标签自动闭合的功能。但是对于一些自定义标签 vscode 就不能识别了。这时安装这个插件，vscode 就可以自动识别你的自定义标.

2021-03-08 19:57:20 11511 41

原创解决 axios 请求时不携带 cookie

问题描述最近在做一个项目，开发模式是前后端分离的，用户登录之后服务端返回 cookie 信息，通过 document.cookie 设置 cookie 了，但是发起其他请求时请求头没有cookie ？？？截图：解决方案想到了之前 vue 电商项目中，手动设置了 Authorization ，今天可以 ctrl c+v 了axios.interceptors.request.use(config => { config.headers.cookie = document.cookie

2021-03-04 16:56:50 3650 1

原创 vuex 核心概念 state、mutations、actions、getters

核心概念statemutationsactionsmodules手动引入vuex如果在vue脚手架中没有引入vuex需要进行手动配置。在main.js中添加如下代码：import store from 'vuex'// 在创建vue实例时，将store挂载进去new Vue({ render: h => h(App), store}).$mount('#app') statestate中设置数据源，页面中所有在vuex中存放的数据都要放到store的state

2021-03-02 01:40:44 515

原创 vuex 的基本使用

vuex官方教程：https://vuex.vuejs.org/zh/guide/vuex概述学习vue 的时候组件之间的传值太让人头疼了，有以下三种情况：父向子传值：v-bind子向父传值：v-on兄弟之间的数据共享：$on$emit以上三种情况只适合小范围的传值对于全局数据共享太麻烦了，vuex就是实现组件全局状态管理的一种机制。使用vuex与不使用vuex的情况如下：vuex中的数据都是响应式的，在一个组件中修改了值，其他组件中的值同样被更改。创建项目

2021-03-02 01:35:26 201 2

缚己