自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

chi1130的博客

一步两步,一步一个魔爪

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

原创 el-table动态合并单元格

需求背景批量创建多个计划(plan),计划按组(group)进行分配,计划创建完成之后可以修改,删除每个组第一列单元格合并显示第几组,组内添加全选/反选组下面的计划组内计划删除完了之后组删除demo在线测试代码github代码<template> <div style="padding:0 20px"> <el-form :inline="true" :model="formInline" :rul

2022-02-15 20:54:47 1151 1

原创 mockjs生成图片资源找不到

error: Too big of an image!对比正确的 https://dummyimage.com/200x100错误的 https://dummyimage.com/200×100经过对比发现是 x 符号的问题代码修改直接 replace 替换就好了在线 DEMOconst Mock = require('mockjs')export default { 'GET /mock/api/users': Mock.mock({ status: 'succes

2021-11-25 22:09:09 1084

原创 vue实现树形tree展示组件封装

效果在线demo????????代码TreeItem.vue<template> <div class="tree-item"> <div @click="handleToggle" class="tree-title"> <i v-if="hasChild" :class="open?'el-icon-remove-outline':'el-icon-circle-plus-outline'"></i>

2021-11-02 22:20:23 1563

原创 nginx http转https

域名、子域名、ssl证书域名子域名的开通网上找找都有,很简单,这里主要讲证书的问题一个域名一个证书建议创建一个my_configs文件夹里面放各种项目配置xx.conf 在nginx.conf #gzip on;下面 添加 include ./my_configs/*.conf;server { listen 80; server_name demo.xxx.cn; location / { rewrite (.*) https://demo.xxx.cn.cn$1 p

2021-10-27 22:21:22 177

原创 nodejs服务获取微信用户openid

前端代码接口发送code就可以<template> <view class="brn-wrap"> <view class="uni-btn-v" v-if="!hasLogin"> <button @click="handleBeforeLogin">{{ title }}</button> </view> <view class="uni-btn-v" v-e

2021-10-27 22:20:21 721

原创 node server如何实现登录生成token及接口校验token

创建方法在utils下创建一个token.js 抛出setToken,getToken方法var jwt = require("jsonwebtoken");var jwtSecret = "write messages"; //签名//登录接口 生成token的方法var setToken = function(_id, openid) { return new Promise((resolve, reject) => { //expiresln 设置token过期的时间

2021-10-27 22:19:16 345

原创 node+mongodb+vue实现一个写寄语小程序

前言近期利用十一的时候写了一个小程序,把node、mongodb、nginx、vue的知识点复习了一遍,从开发到上线流程梳理了一遍,下面是一些涉及到的易错步骤1、如何使用multer实现文件上传及回显2、node server如何实现登录生成token及接口校验token3、mongoose操作数据4、centos7 安装mongodb、pm2等5、nginx http转https6、nodejs服务获取微信用户openid完整代码前端node服务端预览...

2021-10-27 22:17:49 162

原创 按返回日期数据显示刚刚,几分钟前/几点几分/今天/昨天/具体日期

需求实现一个消息通知,类似微信聊天一样,按时间显示刚刚,一个小时前,今天xx,昨天。。。。export const dateTimeFormat = date => { // auto 0 const autoZero = (n) => (String(n).length === 1 ? '0' : '') + n // string to timestamp const strToTimestamp = (str) => Date.parse(str.replace

2020-11-05 20:22:16 490

原创 解决vue中移动端ios键盘收起页面不归位问题

前言网上找的例子千篇一律~~~~~代码<template> <div> <div @focusout="inputBlur" @focusin="inputFocus"> <input type="tel" placeholder="请输入手机号" /> <input type="number" p...

2020-03-24 20:57:59 835

原创 DateTimePicker自定义选择大于当前时间限制

问题something think代码<template> <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="150px" class="demo-ruleForm" > <el-form-item label="大于...

2020-03-09 22:54:39 5520

原创 原生js实现redux中getState,subscribe,listener,dispatch函数

原生代码<!DOCTYPE html><html lang="en"> <!-- 原生js实现dispatch 函数 --> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initia...

2020-03-01 20:13:13 656

原创 nodejs中常见的跨域处理

跨域问题ajax 同源策略 协议 主机(ip,域名) 端口号协议,端口corsheader 头文件信息jsonp服务器解决 ????‍♀️协议,端口将跨域的文件放入与服务器一样的文件下cors以 express 为例const express = require('express');const cors = require('cors');...your co...

2020-02-23 21:48:59 301

原创 2019-nCoV为期两周的宅计划

前言2019 年 12 月以来,湖北省武汉市持续开展流感及相关疾病监测,发现多起病毒性肺炎病例,均诊断为病毒性肺炎/肺部感染,在这里提醒各大小朋友做好自我保护:保持基本的手部和呼吸道卫生,坚持安全饮食习惯,并尽可能避免与任何表现出有呼吸道疾病症状(如咳嗽和打喷嚏等)的人密切接触。同时向奋斗在一线的医务人员致敬,抗战疫情,为武汉和中国加油!初来上海,公司规定需居家隔离 14 天,对自己负责同时也对...

2020-02-20 20:45:32 456

原创 怎么使用docker运行nuxt项目

个人日常 DEMOgit clone [email protected]:chengheai/ssr-project.git添加 Dockerfiletouch Dockerfilevi DockerfileFROM node:8.11.0WORKDIR /optADD node_modules /opt/node_modulesADD server /opt/serverADD ...

2020-01-08 22:10:37 1487

原创 小程序中优雅的获取手机号

前言最近在写小程序项目,有个获取手机号功能,网上荡了一下,虽不说是代码问题,有些文章都是残缺不全的,说到容易错误的区域又并未使用代码避免,说而不做的问题,索性自己结合网上的文章及官网文档写了一套完整的代码,完全开箱即用 ????????‍♂️????????????效果代码//Page ObjectPage({ data: {}, getPhoneNumber: function(e) { let ...

2020-01-08 22:05:17 827

原创 解决iOS12及一下弹框滚动会带动body内容滑动

前言在移动项目开发中往往会写一些 H5 页面,一个项目可能只有一两个页面,引入其他 UI 组件项目显得太臃肿,也没有啥必要,毕竟那些组件都是被人写的,有的时候不能一味的去使用他人写好的代码,有时间也需要自己谢谢,锻炼自己的同时也在巩固一些基础知识~~问题一个页面弹出一个框,框里的内容可以滚动,但是滚动弹框时,body 内容也在动 【前提是你的 body 超过屏幕的高度】,然而在 iOS13 ...

2019-11-21 22:07:33 1248

原创 vue中实现图片上传添加自定义水印并下载

前言最近看了一篇用 Angular4+ 写的添加水印功能,觉得挺好玩,就自己试着用 vue 写一个相同功能效果LIVE☀️???????????? 在线例子 ????????☃️❄️代码✈️✈️✈️✈️✈️✈️ 直达完整代码 ????✈️????????????????<div class="wrap"> <div class="optea"> <div class="file-upload"&gt...

2019-11-21 22:06:34 4934 1

原创 多个el-select共用一个options且一个option只能用一次

需求一个表单多个下拉框,假如 options 里有中国,美国,第一个 select 选择里中国那么第二个 select 的 options 中国就置为灰色,反之我第二个选里中国,第一个 options 中中国就置为灰色效果DEMO在线 demo ⛩⛽️????✈️????????????????代码<template> <div> <el-form :model="rul...

2019-10-21 22:24:11 2924 2

原创 git分支上删除某次提交与获取其他分支上某个提交

前言~在日常开发中,常常会碰到这样的问题,我们在dev分支上写好的代码,经过严格的测试确认无误没有问题,打包发不到正式环境上去了,后来产品经理说这个功能不是本期上的,但是正式服已经有了,那怎么弄呢?例子例如,现在当前分支上代码有三次提交,我想把其中间一次提交去掉,怎么做?步骤:git log // 查看log信息记下commitIdgit rebase -i commitId //...

2019-10-15 22:59:15 1908

原创 Linux执行history命令显示命令执行时间

附录在线快速生成JSON对象api【MYJSON】(http://myjson.com/1g17dp)前言在实际项目开发中,往往碰到这样一种情况,我明明没有敲这个指令啊,怎么代码被覆盖了?怎么回事?????用history命令查看 :这时间也没有也不知道是谁敲的名字,这可咋办?效果实现过程在你的命令行中贱【键】入echo 'export HISTTIMEFORMAT="%Y-%m...

2019-09-17 22:26:03 1412

原创 在Linux服务器上Nginx部署vue静态项目

前言最近看了看nginx,觉得挺好玩,刚好自己有一个VPN测试服务器,就自己敲了一遍,部署一个vue-cli初始化项目~另外给大家推荐一个免费试玩的服务器腾讯云☁️实验室,每天有大约6个小时的时间可以使用,两个ubuntu,一个ubuntu是3小时3 + 3 = 6安装nginx安装~命令行输入wget http://nginx.org/download/nginx-1.12.2.t...

2019-09-11 22:57:00 1395

原创 解决vscode中js文件提示typescript语法报错

前言最近在vue项目中,全局安装了一下typescript,再看看vue项目代码就有一大堆ts提示错误然后网上一搜也没啥好答案~例如:❌❌解决办法:在设置里面加上 “javascript.validate.enable”: false 禁用默认的 js 验证这样禁用那我js写错了都不知道。。。正解~设置中搜索tsconfig ->Check JS Experimental De...

2019-09-11 22:55:13 24384 3

原创 Axios无法在Safari浏览器及微信中打开

前言最近在项目开发中碰到这样一个问题,刚登录完用 axios 调订单列表接口时,总是提示 token 过期失效。仔细想想,刚登录的返回的 token 都没存在 window.document.cookie 中,怎么会过期呢。经过沿路抽丝剥茧,debugger,打印出来的 token 依然是最新的返回,这使得我不禁陷入了沉思 ????????????????‍♂️,为啥?正常代码 // list getList...

2019-09-09 22:02:50 2103

原创 vue中audio实现微信语音播放动画

预览思路拿到时长做倒计时,时长 = ( 时长 + 1 ) * 100; destroy的时候清除一下代码<div style="display:none"> <audio controls="controls" ref="audio"> <source :src="url || ''" type="audio/mpeg" /> <...

2019-09-09 22:01:34 4811 3

原创 css常见的规范标准

前言你是否常常碰到以下问题:你总是看不懂他写的代码,或者读起来很吃力;你需要改他的代码却无从下手,或总是要去问他这里是什么改了会不会影响其他代码;你和他一起开发一个产品,你总是怕代码和他有冲突或互相影响;你的代码在多次维护任务之后变得越来越臃肿,越来越难以维护。很多时候起名字都很随意,但也想起个正常点的名字,有标准例子吗?附带MarkDown快速生成表格统一语义理解和命名布局(.g-)...

2019-09-05 21:26:49 1050

原创 vue中audio动态绑定src不能播放

前言略去。。。代码<audio id="audio" controls> <source :src="audUrl || '../assets/alarm.ogg'" type="audio/ogg" /></audio>问题发现问题绑定的时候,发现并不管用let audio = document.querySelector('#audio...

2019-09-05 21:25:25 5556 5

原创 vue-ssr服务端渲染添加多个swiper

问题一个ssr项目添加多个swiper会引起轮播图混乱。前言在使用nuxt.js实际开发项目中,会出现类似这样的情况,一个页面写两个【PC端一个,移动端一个】或者多个【其他需求】,在官方github有关服务端渲染的文档少之又少,只有一个简单的使用demo,且与vue-cli项目使用还有点差别,那怎么解决?单个使用<template> <div v-swiper:my...

2019-08-27 21:06:42 1164

转载 git常用指令大全

查看、添加、提交、删除、找回,重置修改文件git help <command> # 显示command的helpgit show # 显示某次提交的内容 git show $idgit co -- <file> # 抛弃工作区修改git co . # 抛弃工作区修改git add <file> # 将工作文件修改提交到本地暂存区git add . #...

2019-08-20 22:14:43 85

原创 vue-quill-editor富文本内容在页面中样式丢失

现象用富文本的情况有很多,例如在后台管理系统排版好的富文本页面,准备在移动端页面去显示,或者在官网显示,两个项目不在一起,在管理系统排好的样式在显示页面显示的一塌糊涂,为啥呢?大多数情况是样式没有引入。解决给容器增加一个class ql-editor,才能正常显示,另外前面是主题类名,不同的主题显示不同的样式 <link href="http://cdn.quilljs.com/1...

2019-08-20 22:12:32 10189 1

原创 微信支付当前页面的URL未注册问题[单页面]

前言微信支付时,当调用微信支付的时候,微信会判断当前页面和微信公众号后台设置的支付授权目录是否一致,他会把页面最后一次刷新的url作为判断依据(如果用户刷新了任何页面,这个页面就是支付页面),这个时候,单页应用的路由中‘#’后面的内容也会被传递过去,在微信的判断流程里,这个url和设置的目录是不匹配的,因为涉及到多个页面都会发起支付请求,所有设置多个带页面参数的url是不合理的,所以这里在‘#’...

2019-08-13 21:35:48 16119 3

原创 vue自定义抽屉组件

前说在项目开发中,有很多时候由于某某原因,很多UI组件不能被用,像移动端一个小的H5页面,引入一个大的antd-mobile显然也不合理,所以就有了很多形形色色的自定义组件了。效果LIVEdemo代码drawer.vue<template> <div class="drawer"> <div :class="maskClass" @clic...

2019-08-08 21:34:09 3865 1

原创 原生js实现点击复制文本

参考文档queryCommandStateclipboardDataqueryCommandSupportedexecCommand预览demo代码 handleCopy(text) { if (window.clipboardData && window.clipboardData.setData) { return window.clipb...

2019-08-06 20:53:13 279

原创 常见js中易错小题介绍

前说在前端面试过程中,有时候会因为一些小题而使你与offer失之交臂,这也反应出你的基础知识点不扎实,或做事粗心大意,很多公司也喜欢出这样的题目来考察面试者的基本水平。下面总结了一些典型的面试易错题。典题1、下面哪个是错误的?A : li:nth-of-child(1)B : li:nth-of-type(1)C : li:nth-last-child(1)D : li:nth-l...

2019-07-16 13:52:58 143

原创 面试题[1,2,3].map(parseInt)解析

题目let a = ['1','2','3'].map(parseInt);console.log(a);答案// [ 1, NaN, NaN ]解析代码解析1、传入一个参数var arr = ["1", "2", "3"].map(function(item){ // 这个地方只传入一个参数 return item;});console.log(arr);// [...

2019-07-16 10:46:57 816

原创 前端js综合经典面试题

前记前些时间,面试中写的笔试题,偶然的机会做了两次,最后还是错了几道,结果回来在网上一挡,哎。。不过说实话,该公司面试题道道都是经典题,的确不错,长知识了。题目function Foo() { getName = function() {console.log(1);}; return this;}Foo.getName = function() {console.log(2);};...

2019-07-15 22:09:41 531

原创 关于js中构造函数手写return的影响

例子基础例子构造函数正常的应该是这样的格式,new关键字调用函数,函数名首字母大写。// 一个类function Fun(name, age, sex) { this.name = name; this.age = age; this.sex = sex;}// 实例var obj = new Fun('alex', 12, 'male');console.log(ob...

2019-07-15 22:08:37 361 1

原创 浅谈js中函数的继承方式

~~ 回首往昔, 更近一步 ~~招式1. ES5 构造函数继承function Parent() { this.name = 'parent'; this.colors = ['black', 'yellow', 'red']}function Child() { Parent.call(this); this.type = 'child';}var q1 = ne...

2019-07-09 15:44:19 3775

原创 使用vue中mixin制作一个公用el-table组件

官网原话混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项功能~1.选项合并~1.全局混入~1.自定义选项合并策略具体看官网介绍:https://cn.vuejs.org/v2/guide/mixins.html需求假如我们的项目中有很多重复类...

2019-07-09 13:49:40 1453 1

原创 有关前端js中this指向的问题笔记

前言在以往的ECMAScript 5中,this的指向可谓是多种多样,在各个公司面试题也是必考项,现收集几个面试题进行解析:原题解析题1:var o = { fn: function(){ var a = 1; console.log(this.a); }}o.a = 2;o.fn.a = 3;o.fn();*分析:o.a = 2; // 赋值, 即给...

2019-07-08 20:37:08 201

原创 vue项目按需使用keep-alive

需求list 页面做缓存add/edit 页面不做缓存detail 页面不做缓存…前人法子<keep-alive> <!-- 需要缓存 --> <router-view :include="include" v-if="$route.meta.keepAlive" /></keep-alive><!-- 不需要缓存 ...

2019-05-23 22:45:51 397

空空如也

空空如也

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

TA关注的人

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