- 博客(49)
- 收藏
- 关注
RSS订阅原创 nuxtjs服务器部署ssr项目
打包项目npm run build将以下文件上传到服务器对应的工程目录安装依赖在项目根目录下执行npm install启动项目默认访问3000端口npm run start注意事项运行项目时可能会报以下错误Nuxt Fatal ErrorEnable vuex store by creating `store/index,js`解决方案在服务型项目根目录下创建空文件 store/index.js；再次启动项目...
2021-11-09 08:54:09
596
原创 nodejs http模块实现简单的文件上传
相关依赖http # http服务器fs # 文件读写操作formidable # form表单对象解析path # 系统路径相关代码const http = require('http')const fs = require('fs')const formidable = require('formidable')const chalk = require('chalk')const path = require('path')const port
2021-06-24 09:11:13
1508
原创 npm包的开发与发布
什么是包？JavaScript模块的基本单位是单个js文件，复杂的模块往往是由多个子模块组成的；多个子模块组成的大模块便称为包；组成的包需要一个入口模块，入口模块的导出对象被称作包的导出对象。工程目录- /node-echo/ # 工程目录 - bin/ # 命令行相关代码 node-echo.js + doc/ # 文档 - lib/ # API相关代码 echo.js - node_modules/ #
2021-06-23 12:46:01
180
原创 react17+redux+react-router-dom实现路由拦截登录
创建全局redux store实例import { createStore, combineReducers, applyMiddleware } from 'redux'import logger from 'redux-logger'import storage from '../storage'import { authenticatedSuccess } from '../utils/session'const storageUserInfo: UserInfoType = storag
2021-06-21 15:04:19
869
原创 React17+Mobx6实现TodoList一（class component）
一、介绍什么是mobx mobx是一款简单、可扩展的状态管理库；可应用于react大型项目中，便于项目的维护和管理。执行机制 
2
原创 Vue实现组件自定义数据双向绑定
自定义v-model语法糖基本用法v-model默认方式：通过在组件上定义一个名为value的props,同时对外暴露一个名为input的事件。满足于基本的表单文本框数据绑定使用。组件源码<template> <div class="u-input"> <input :value="value" @change="$_handleChnage"/> </div></template><script&g
2020-07-07 11:13:48
531
原创 Vue2.x选项合并策略二（自定义选项合并策略和生命周期函数）
Vue2.x选项合并策略一（源码解读）根据上篇文章对选项合并策略源码的解读，可以利用Vue内部提供的API实现自定义的合并策略以及生命周期钩子函数。Vue.config.optionMergeStrategiestips：以下父组件选项可理解为mixins混入的数据；子组件选项为当前自身组件选项。自定义选项合并策略/src/utils/customMergeHook.js合并策略：若子组件选项不存在，则返回父组件选项；否则，判断父组件选项是否存在，如果存在则合并父子组件选项；不存
2020-07-03 16:38:04
575
原创 Vue2.x选项合并策略一（源码解读）
了解选项合并策略在Vue中，使用mixins的时候发现：混入的methods里的方法如果与组件里的方法同名时，会被组件的方法覆盖；但生命周期函数如果重名，混入的生命周期函数与组件本身的都会被执行，执行顺序为先执行混入后执行自身。这主要与Vue中的选项合并策略有关，不同的选项有不同的合并策略。例如data、props、methods都是同属性直接覆盖合并；像created、mounted等生命周期函数都是直接合并，同名的函数存放在一个数组中，依次进行调用。Vue提供一个api：Vue.config.o
2020-07-03 10:09:21
374
原创 Vue实现全局loading指令开发
开发loading组件/src/components/Loading/index.vue<template> <transition name="u-loading-fade"> <div v-show="visible" class="u-loading-mask"> <div class="u-loading-spinner"> <img src="~@/assets/loading.gif"/>
2020-06-30 15:22:35
826
原创 Vue.observable实现一个简易的Vuex状态管理
创建store/src/store/index.jsimport Vue from 'vue';// 利用Vue.observable 实现一个可响应的对象export const store = Vue.observable({ username: 'aa', age: ''})// 定义提个mutations， 实现可修改属性export const mutations = { setUsername(name) { store.username = name
2020-06-30 11:02:32
198
原创 Vue 全局loading组件开发
开发loading组件/src/components/Loading/index.vue<template> <transition name="u-loading-fade"> <div v-show="visible" class="u-loading-mask"> <div class="u-loading-spinner"> <img src="~@/assets/loading.gif"/>
2020-06-30 09:53:37
1384
原创 Vue CLI3.x 配置sass全局变量
编写scss文件/src/styles/variable.scss$theme-color: #F00;安装依赖包npm install --save-dev node-sass sass-loader sass-resources-loader配置文件/vue.config.js（没有该文件的话请在项目根目录下新建）module.exports = { ..., css: { loaderOptions: { sass: { data: `@import "@/st
2020-06-28 09:49:01
572
原创 nodejs实现OAuth2模式第三方GitHub授权登录
第三方授权登录原理网页登录认证，请求后台服务器后台服务器重定向到GitHub认证GitHub服务器第三方认证GitHub服务器认证成功，回调带回认证状态code给后台服务器后台 服务器用code想GitHub服务器申请令牌申请成功，GitHub服务器向后台服务器返回认证令牌；后台服务器根据令牌获取GitHub用户信息刷新页面一、GitHub服务器配置 &...
2020-01-16 11:13:05
1468
1
原创 nodejs数据持久化--MongoDB（4）mongoose实现restful接口开发
目录结构restful│ conf.js│ index.js│├─framework│ api.js│ loader.js│ router.js│└─model article.js user.js
2020-01-10 11:42:47
394
原创 nodejs数据持久化--MongoDB（3）mongoose
// 依赖const mongoose = require('mongoose')// 连接mongoose.connect('mongodb://localhost:27017/test1', { useNewUrlParser: true})const conn = mongoose.connectionconn.on('error', (e) => { cons...
2020-01-10 09:54:00
125
原创 vue实现element-ui el-table表格导出excel文件
需求：将下表数据导出excel文件方法：一、安装依赖npm install --save xlsxnpm install --save file-saver二、添加属性标签添加ref属性，用于获取该元素el；也可添加id属性获取表格内容省略 <el-table ref="exportTableRef"> ... </el-table>三、添加方法...
2020-01-08 15:15:16
549
2
原创 nodejs数据持久化--MongoDB（2）案例实现
project│ index.html│ index.js└─model │ conf.js └─db.js数据库配置参数 conf.jsmodule.exports = { // 数据库地址 url: 'mongodb://localhost:27017', // 数据库名称 dbName: 'test'}数据库配置 db.jsconst conf...
2020-01-06 09:53:08
219
原创 nodejs数据持久化--MongoDB（1）原生操作
引入依赖const { MongoClient: MongoDB } = require('mongodb')创建数据库连接// 创建客户端const client = new MongoDB('mongodb://localhost:27017', { // 新老版本兼容 useNewUrlParser: true})// 连接ret = await client.c...
2020-01-03 17:31:03
167
原创 nodejs数据持久化--MySQL（2）Sequelize对象关系映射
引入依赖const Sequelize = require('sequelize')建立数据库连接// 建立连接const sequelize = new Sequelize('数据库名称', '用户名', '密码', { host: 'localhost', /* 数据库类型 'mysql' | 'mariadb' | 'postgres' | 'mssql' */ di...
2019-12-27 18:18:37
821
原创 nodejs数据持久化--MySQL（1）SQL原生操作
安装数据库依赖 mysql2地址npm install --save mysql2配置数据库连接const mysql = require('mysql2/promise')// 数据库连接配置const cfg = { host: 'localhost', user: 'root', password: 'ZSY4563695158', database: 'node...
2019-12-27 14:57:09
341
原创 nodejs数据持久化--文件系统
// 实现一个文件系统读写数据库const fs = require('fs')const path = require('path')// 文件名const jsonFile = path.resolve(__dirname, './db.json')// 读数据function get(key) { fs.readFile(jsonFile, (err, data) =&g...
2019-12-26 17:42:05
815
1
原创 nodejs实现文件下载
文件目录结构index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta ht...
2019-12-26 15:18:14
1316
原创 js实现短信验证码倒计时
// 倒计时function countDown() { let show = true let count = 0 let timer = null if (!show) return const TIME_COUNT = 15 if (!timer) { count = TIME_COUNT show = false timer = setInterval(() =&...
2019-12-19 17:35:03
265
转载 cookie字段属性详解
name字段为一个cookie的名称。value字段为一个cookie的值。domain字段为可以访问此cookie的域名。非顶级域名，如二级域名或者三级域名，设置的cookie的domain只能为顶级域名或者二级域名或者三级域名本身，不能设置其他二级域名的cookie，否则cookie无法生成。顶级域名只能设置domain为顶级域名，不能设置为二级域名或者三级域名，否则coo...
2019-12-19 16:39:36
1918
原创 HTTP 请求方法
方法描述支持的http版本GET请求指定的页面信息，并返回实体主体。1.0 / 1.1POST向指定资源提交数据进行处理请求（例如提交表单或者上传文件）。数据被包含在请求体中。 POST 请求可能会导致新的资源的建立和/或已有资源的修改。1.0 / 1.1HEAD类似于 GET 请求，只不过返回的响应中没有具体的内容，用于获取报头。1.0 / 1.1...
2019-12-18 10:28:24
428
原创 GET和POST的区别
get参数通过url传递，浏览器直接发出的get请求只能由一个url触发。post放在request body中。get请求在url中传递的参数是有长度限制的，而post没有。get比post更不安全，因为参数直接暴露在url中，所以不能用来传递敏感信息。get请求只能进行url编码，而post支持多种编码方式get请求会浏览器主动cache，而post支持多种编码方式...
2019-12-18 10:16:04
41
转载 http状态码
100 Continue 继续。客户端应继续其请求101 Switching Protocols 切换协议。服务器根据客户端的请求切换协议。只能切换到更高级的协议，例如，切换到HTTP的新版本协议200 OK 请求成功。一般用于GET与POST请求201 Created 已创建。成功请求并创建了新的资源202 Acc...
2019-12-17 17:13:16
56
原创 cookie与session的区别
cookie数据存放在客户的浏览器上，session数据放在服务器上。cookie不是很安全，别人可以分析存放在本地的COOKIE并进行COOKIE欺骗考虑到安全应当使用session。session会在一定时间内保存在服务器上。当访问增多，会比较占用你服务器的性能考虑到减轻服务器性能方面，应当使用COOKIE。单个cookie保存的数据不能超过4K，很多浏览器都限制一个...
2019-12-17 16:35:46
48
原创 Cookie、sessionStorage、localStorage之间的区别
相同点：都是将数据保存在浏览器端，且都是同源的。不同点：Cookie：cookie数据始终在同源的http请求中携带（即使不需要），即cookie在浏览器和服务器间来回传递。而sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存。cookie数据还有路径（path）的概念，可以限制cookie只属于某个路径下,存储的大小很小只有4K左右。 （key...
2019-12-17 16:26:43
97
原创 移动端rem响应式解决方案
设置meta标签<meta id="viewport" name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1; user-scalable=no;">上述meta标签的每一个属性的详细介绍如下：属性名取值描述width正整数定义布局视口的宽度，单位...
2019-12-17 15:58:26
152
原创 买卖股票的最佳时机
给定一个数组，它的第 i 个元素是一支给定股票第 i 天的价格。如果你最多只允许完成一笔交易（即买入和卖出一支股票），设计一个算法来计算你所能获取的最大利润。注意： 你不能在买入股票前卖出股票。示例 1:输入: [7,1,5,3,6,4]输出: 5解释: 在第 2 天（股票价格 = 1）的时候买入，在第 5 天（股票价格 = 6）的时候卖出，最大利润 = 6-1 = 5 。注意利润...
2019-12-16 15:45:04
76
原创 猜数字大小
我们正在玩一个猜数字游戏。 游戏规则如下：我从 1 到 n 选择一个数字。 你需要猜我选择了哪个数字。每次你猜错了，我会告诉你这个数字是大了还是小了。你调用一个预先定义好的接口 guess(int num)，它会返回 3 个可能的结果（-1，1 或 0）：-1 : 我的数字比较小1 : 我的数字比较大0 : 恭喜！你猜对了！*注意：这里的「我的数字」 指的你要猜的数字，不是你输入...
2019-12-16 14:36:32
220
原创 搜索插入位置
给定一个排序数组和一个目标值，在数组中找到目标值，并返回其索引。如果目标值不存在于数组中，返回它将会被按顺序插入的位置。你可以假设数组中无重复元素。示例 1:输入: [1,3,5,6], 5输出: 2示例 2:输入: [1,3,5,6], 2输出: 1示例 3:输入: [1,3,5,6], 7输出: 4示例 4:输入: [1,3,5,6], 0输出: 0...
2019-12-13 17:35:51
42
原创 重复叠加字符串匹配
给定两个字符串 A 和 B, 寻找重复叠加字符串A的最小次数，使得字符串B成为叠加后的字符串A的子串，如果不存在则返回 -1。举个例子，A = “abcd”，B = “cdabcdab”。答案为 3， 因为 A 重复叠加三遍后为 “abcdabcdabcd”，此时 B 是其子串；A 重复叠加两遍后为"abcdabcd"，B 并不是其子串。注意:A 与 B 字符串的长度在1和10000区间...
2019-12-13 11:20:00
219
原创 重复的子字符串
给定一个非空的字符串，判断它是否可以由它的一个子串重复多次构成。给定的字符串只含有小写英文字母，并且长度不超过10000。示例 1:输入: “abab”输出: True解释: 可由子字符串 “ab” 重复两次构成。示例 2:输入: “aba”输出: False示例 3:输入: “abcabcabcabc”输出: True解释: 可由子字符串 “abc” 重复四次构成...
2019-12-12 17:42:37
159
原创 实现indexOf()方法
实现 indexOf() 函数。给定一个 haystack 字符串和一个 needle 字符串，在 haystack 字符串中找出 needle 字符串出现的第一个位置 (从0开始)。如果不存在，则返回 -1；当 needle 是空字符串时返回 0 。示例 1:输入: haystack = “hello”, needle = “ll”输出: 2示例 2:输入: haystack...
2019-12-12 11:26:35
1178
1
原创 数组移动零
给定一个数组 nums，编写一个函数将所有 0 移动到数组的末尾，同时保持非零元素的相对顺序。示例:输入: [0,1,0,3,12]输出: [1,3,12,0,0]说明:必须在原数组上操作，不能拷贝额外的数组。尽量减少操作次数。方法：var moveZeroes = function (nums) { /** * i = 0 nums[0] = 0 ...
2019-12-12 10:36:51
154
原创 vue + element-ui el-form在el-table中的表单验证
在开发过程中偶尔遇到el-table嵌套el-form，而且还需要表单验证的需求，如下图：解决方案：动态定义el-form-item的prop属性，保证唯一性，并设置独立的rules属性。<el-form-item :prop="'applyDataList.' + scope.$index + '.value3'" :rules="applyRules.value3">h...
2019-12-11 15:57:01
3681
原创 删除排序数组中的重复项
给定一个排序数组，你需要在原地删除重复出现的元素，使得每个元素只出现一次，返回移除后数组的新长度。不要使用额外的数组空间，你必须在原地修改输入数组并在使用 O(1) 额外空间的条件下完成。示例 1:给定数组 nums = [1,1,2],函数应该返回新的长度 2, 并且原数组 nums 的前两个元素被修改为 1, 2。你不需要考虑数组中超出新长度后面的元素。示例 2:给定 nu...
2019-12-10 17:51:21
81
1
原创 有效的括号
给定一个只包括 ‘(’，’)’，’{’，’}’，’[’，’]’ 的字符串，判断字符串是否有效。有效字符串需满足：左括号必须用相同类型的右括号闭合。左括号必须以正确的顺序闭合。注意空字符串可被认为是有效字符串。示例 1:输入: “()”输出: true示例 2:输入: “()[]{}”输出: true示例 3:输入: “(]”输出: false示例 4:...
2019-12-10 16:47:26
48
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人