- 博客(41)
- 收藏
- 关注
RSS订阅转载 vue路由history模式刷新404问题解决方案
vue单页因微信分享和自动登录需要，对于URL中存在’#’的地址，处理起来比较坑。用history模式就不会存在这样的问题。但是换成history模式，就会有个新的问题，就是页面刷新后，页面就无法显示了（404）。对于这个问题，我们只需要在服务器配置如果URL匹配不到任何静态资源，就跳转到默认的index.html。我这里是针对nginx的配置，总结如下：方案一 （这种方式容易被第三方劫持）location /{ root /data/nginx/html; ind
2020-10-28 15:03:53
2418
原创 Nuxt从项目搭建到部署（持续更新中）
为什么要用nuxt基于 Vue.js自动代码分层服务端渲染强大的路由功能，支持异步数据静态文件服务ES2015+ 语法支持打包和压缩 JS 和 CSSHTML 头部标签管理本地开发支持热加载集成 ESLint支持各种样式预处理器： SASS、LESS、 Stylus 等等支持 HTTP/2 推送一、安装nuxt确保安装了npx，npx在node 5.2.0默认安装（安装时请用cmd，git bash可能导致Use arrow keys无法选择）npx create-nuxt
2020-06-17 11:56:20
1078
原创 docker初体验
一、为什么要用docker提供一次性的环境。比如，本地测试他人的软件、持续集成的时候提供单元测试和构建的环境。提供弹性的云服务。因为 Docker 容器可以随开随关，很适合动态扩容和缩容。组建微服务架构。通过多个容器，一台机器可以跑多个服务，因此在本机就可以模拟出微服务架 构。（非常重要，传统虚拟机启动项目时只能启动一个，如果想启动另一个只能关掉当前运行项目，再去启动）二、安装dockerMACWINDOWSUbuntuDebianCntOSFedora其他 Linux 发行版
2020-06-16 17:45:49
328
原创 picGo + gitee 搭建个人图床
一、下载一个picGohttps://github.com/Molunerfinn/PicGo/releaseswindows选择exe，mac选择dmgpicGo可以应用八种图床，我们主要用的github和gitee。但是他列表中没有gitee，我们想要使用gitee，那么要在插件中，添加github-plus，加好后，我们的侧边栏会出现一个githubPlusgithubplus配置repo：用户名/仓库名（用户名哦）branch：分支名token：私有仓库密钥path：上传到仓
2020-06-16 11:13:16
811
原创 vue监听游览器高度变化做内容自适应
vue监听游览器高度变化做内容自适应data() { setHeight: 500, browserHeight : 500},mounted() { // 进入页面时监听游览器高度变化 window.addEventListener('resize', this.getHeight)},watch: { browserHeight: { // 游览器高度变化时，动态设置高度 handler(nv) { this.setHeight = nv - 400 > 300
2020-05-27 10:44:34
743
原创 上传下载POST请求
上传下载POST请求，在此记录下const form = document.createElement('form') form.style.display = 'none' form.action = `${CONFIG.HAWK_EYE_URL}/Download/download` form.method = 'post' document.body.appendChild(for...
2020-04-30 10:31:20
185
原创 iview 点击tree节点文字展开
一行代码即可，把节点的expand设为true<Tree :data="tree" :render="renderContent" class="tree" empty-text></Tree>renderContent(h, { root, node, data }) { return h( 'span', { style: { display...
2020-03-23 11:14:36
1709
原创 Error: listen EADDRINUSE: address already in use
经常遇到这个报错，在此记录一下根据错误提示，Error: listen EADDRINUSE: address already in use 0.0.0.0:80，意思是80端口已经被占用。这时，我寻找的解决方案为：1、win+r 输入cmd 打开终端2、运行netstat -ano，找到报错信息提示的端口号那一行，记住最后那个数字 3.接下来运行tskill “最后那个数字”，所以...
2019-12-12 09:49:17
11955
1
原创 算法基础（持续更新中）
1、输出字符串中出现最多字符的次数var lengthOfLongestSubstring = function(s) { var numArr = [] for(let i=0; i<s.length;i++) { numArr.push({num: (s.split(s[i])).length-1, name: s[i]}) } var m...
2019-11-20 15:28:01
117
原创 css鼠标特效
一个很漂亮的特效哦这个特效主要是鼠标点击的时候出现一个文字（文字不断不固定），然后向上飘，慢慢变透明，最后透明度为零ok，话不多说，上代码/* 鼠标特效 */ var woedIndex = 0; jQuery(document).ready(function($) { $("body").click(function(e) { v...
2019-11-14 16:47:19
1362
1
原创 ajax发送请求的时候，能发送成功，并且有成功的返回值，但是进不去success回调函数里面
今天遇到了一个问题，一直找原因。那就是前端ajax请求，后端返回了值，是成功的。但是就是进入不了success。多方查找原因，原来是我写了dataType: “json”,而后端返回的是test，所以把json改为’test’就可以进入success了前端代码<!DOCTYPE html><html> <head> <title>&...
2019-11-14 15:52:33
348
转载 原生滚动条样式修改
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。/滚动条样式/::-webkit-scrollbar {/滚动条整体样式/width: 4px; /高宽分别对应横竖滚动条的尺寸/height: 4px;}::-webkit-scrollbar-thumb {/滚动条里面小方块/border-radius: 5px;-web...
2019-10-18 15:57:42
818
原创 vue-cli3搭建时的跨域问题
第一种方式：vue.config.js配置如下(代理模式或者是正常模式写法都可以)：module.exports = { devServer: { https: false, hotOnly: false, open: false, // proxy: { // '/api': {//代理api ...
2019-08-22 10:04:47
255
原创 vue cli3搭建后项目启动不成功
今天配置vue cli3时，成功了项目却不能启动报如下错误：修复方式:修改package.json 里面的：“less”: “^3.9.0"为"less”: “~3.9.0”删除node_modules，然后重新安装依赖...
2019-08-20 13:59:24
2081
原创 排序方式
// 随即排序 // 第一种方式 var arr = [10, 1, 8, 2, 5]; for (let i = 0; i < arr.length; i++) { let num = Math.floor(Math.random()*arr.length); arr.push(arr[num]); arr.splice(n...
2019-08-05 14:24:11
166
转载 使用多行省略失效
很神奇的使用多行省略的时候原始代码为：.line-ellipsis-2{ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; -webkit-box-orient: vertical; }默认编译的时候，会过滤-webkit-bo...
2019-07-31 13:05:13
222
原创 git的基本知识
1、git pull2、git commit3、git clean 4、提交代码时忘记pull5、提交错分支6、git push -f7、git revert 8、git commit 之后有人push9、保存修改和删除，但是不包括新建文件 git add -u10、追踪改变11、git worktree12、其他命令13、本地修改的某个文件想要撤回14、git reba...
2019-07-16 16:13:53
204
原创 实现下拉滚动加载
下拉滚动加载首先，如果你本身需要滚动加载的块是隐藏的，那么就等他显示在监听滚动事件，否则直接在mounted里面监听就可以了// 定义监听事件const sealPopover = document.querySelector('.choose-seal-content.seal-box');sealPopover.addEventListener('scroll', this.scrol...
2019-07-03 17:30:36
1166
原创 checkbox中v-model绑定值手动设置true后再点击取消需要点击两次
今天在项目中遇到一个需求，如下：要留最后一个选项，不能都点掉，当我手动把最后一个设置为true时，添加一个其他的，再点击之前的最后一个，发现取消不了，要点击两次。解决方式： 在change方法中添加.native修饰符html中 @change.native="changeChoose"js中changeChoose(changeItem) { let nv = this...
2019-07-03 15:37:13
1353
原创 【vue】当input里面的值修改后，想要在点击叉或者是取消时回退到原值(且不在vue data里面加数据)
在项目中遇到了一个问题，一个input框，输入值之后点击对号改变这个值，点击叉取消，回到原值，上图因为不想在data里面加值，之前是用v-model绑定的，vue中v-model其实就是input和value的结合，输入值触发input，值改变。如下：<input v-bind:value="mes" v-on:input="mes= $event.target.value"/&g...
2019-07-01 17:12:12
5188
原创 css伪类加垂直分割线
加垂直分割线有很多方法：例如：1、最坏的实现就是直接加一个 “|”线，尽量不要这样做2、可以用border来实现。例如： margin-right: 15px; padding-right: 15px; border-right: 1px solid #d9d9d9;3、用伪类实现：.fix-text { &:after { ...
2019-06-29 16:04:03
9865
原创 jquery&data-value实现select下拉，展示区号加地址，选择后只显示区号（select展示和选择不同）
下拉时样式：选择后的样式：思想：首先展示一个select，隐藏div，当点击时，隐藏select，展示由div组成的模拟select下拉样式的组件，点击选择某个时把select的value改成选的的value，隐藏div，展示selectcss：<style> .box { width: 120px; }...
2019-06-21 15:54:00
1818
原创 定时器清空失效问题
清空定时器失败，可以var一个全局的faceInterval，然后在清空的时候用全局的faceInterval就可以了self.faceInterval = setInterval(() => { self.axios({ url: '/faceid/getsignatory', method: 'GET', params: { ac...
2019-05-27 14:25:56
1603
原创 在element动态增加表单校验时，增加第二个校验总是不通过解决方式
我遇到了一个问题，在动态增加表单校验时，增加第二个校验总是不通过，结果发现，我增加的mobileRules为一维数组，当我push进去对应对象事，就会在一个数组里面增加多个校验方式，而每次从第一个开始校验，第一个没通过就直接return。错误写法（mobileRules等于push进去的所有方法，而不是单一的校验方式）： <el-form-item v-for="(con...
2019-05-27 14:20:32
3238
1
原创 highCharts入门
highCharts组成部分如下：一、面积图做面积颜色渐变(配置fillColor里面stops颜色值)：plotOptions:{ area: { fillColor: { } } }x轴数据显示(xAxis里面categories数组里面每个值为x轴值)：xAxis: {categories: [ ]｝在绘制点上面显示提示文字(tooltip)：y轴数据(serie...
2019-04-03 10:39:15
301
原创 js对象中各种原生方法的使用
1.tostring:返回当前对象的字符串形式，返回值为String类型。[1,2,3].tostring(); --->"123";var arr = [1,2,3];arr1= Object.prototype.toString.call(arr);//返回"[object Array]"arr1.slice(8,-1);2.toLocalString();返回当前对...
2019-03-21 13:50:58
612
转载 宏任务微任务同步任务
宏任务微任务同步任务执行顺序以及使用async函数的值有道云笔记地址：http://note.youdao.com/noteshare?id=7d1ac13517dee68ff3b16e2079338bd9&sub=AB8C799DBAD64A2EBBD6FD088A00FB95async await 使用：使用async函数的值let data = this.getBu...
2019-03-20 16:27:55
1006
原创 gulp构建工具
下面是压缩css的步骤，js同理，只是压缩插件不同首先要生成package.json包命令:npm init第二步：安装gulp命令（css需要）：npm install --save-dev gulp第三步：安装(css)所有gulp插件命令：npmigulp-clean-cssgulp-concatgulp-revgulp-rev-collector--save-dev...
2019-03-20 16:24:06
272
原创 桌面应用程序nw.js
一、nw.js开始nw.js（以前称为node-webkit，属于node的一个框架，可以用node的各个模块）：生成一个桌面exe程序中文网：https://nwjs.org.cn/doc/user/Getting-Started.html外网：http://docs.nwjs.io/en/latest/For%20Users/Getting%20Started/nw.js...
2019-03-20 16:11:09
6943
2
原创 date获取时间某年某月一共有多少天以及格式化天数，月份，年
1.获取时间某年某月一共有多少天var day = new Date(2016,2,0); // 年月传进去，最后一位传0，即是当月天数 var daycount = day.getDate(); alert(daycount);//292、// 格式化天数antiDays() {let now = new Date();let getThirtyDate = new...
2019-03-20 16:07:09
2152
原创 数组方法reduce以及filter进行对象属性去重
一、对象属性去重（reduce）reduce function里面四个参数：function(prev, cur, index, array) // reduce四个参数，前一个值，当前值，项的索引，数组对象reduce两个参数，function，初始值reduce(function(), initialValue);下面示例初始值为空数组。arr.reduce(function(...
2019-03-20 16:05:38
840
原创 js原生请求
js原生请求getvar httpRequest = new XMLHttpRequest();//第一步：建立所需的对象httpRequest.open('GET', 'url', true);//第二步：打开连接 将请求参数写在url中 ps:"./Ptest.php?name=test&nameone=testone"httpRequest.send();//第三步：发送...
2019-03-20 15:53:37
4634
原创 垂直居中四种方式
1、单行文本：height 等于line-height2、图片：vertical: align: middle; 注： 还能解决图片和文字一行的时候文字图片不对齐问题3、display: flex; margin: auto;4、absolute定位：top: 50%; left: 50%;transform: translate(-50%,-50%);/* 垂直居中、绝对居中 *...
2019-03-20 15:42:08
232
原创 element switch样式显示错误解决方式
错误显示为：正确显示应为：解决方式：一、npm uninstall element-ui，删不掉的情况下请自行手动删除二、npm install [email protected] --save，手动安装对应版本依赖出现这种状况的原因：npm install 自动安装依赖出现错误，自动安装的依赖如下：找到下面依赖：node-modules -> element-...
2019-02-20 14:37:01
1321
1
原创 关于vue $set在数组中使用问题
一般情况下，$set在对象中使用，例如this.$set(person, 'age', 18);然而，做项目时遇到了在数组中使用$set。那么数组中$set使用第二个参数就不能时属性了，而是index索引，例如let arr = [a, b, c ];假设arr为vue data里面的属性，我想动态在data里面加一个d，那么就要this.$set(arr, 3, d);这...
2019-01-17 16:19:20
6493
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人