Markix的博客

vue路由模式 & 部署路径配置

默认Form表单提交后浏览器地址会跳转到action地址，有时候我们只是想要Form表单发起一个请求，并不希望浏览器的地址跳转。这就需要禁用Form表单的跳转机制。

项目使用了SpringSecurity框架，登录成功后会设置cookie，cookie信息如图：跨域登录成功后（自动设置了cookie），后续的其他请求没有自动携带cookie。解决cookie的属性介绍：https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookie当设置 secure=true 时，只有发送 https 请求才会携带 cookie当设置 SameSite=none 时，跨域请求才会携带 cookie对于我遇到的情况，上

下载文件//请求...then(response => { const fileName = res.headers['content-disposition'].split('=')[1] const url = URL.createObjectURL(response.data) const link = document.createElement('a') // 创建a标签 link.href = url // link.download = d.

get 方式，对params做处理通过 paramsSerializer 指定序列化配置axios.get(`http://localhost:8080/array`, { params: { "ids": ["1", "2"] }, paramsSerializer: function (params) { return Qs.stringify(params, { arrayFormat: 'repeat' }) } });

承接上文 axios.js 之传递数组参数 探究，继续探究后端的数组传参可搞出一系列操作，详见：SpringMVC 数组类型参数定义以及前端如何传参文中给出了各种数据参数的url传参示例，那我们的目的就是要知道，如何通过axios构造出这种形式的url。在之前我们已经知道，问题的关键在于 axios 的序列化配置，而 axios 使用的序列化库为 qs，所以，问题的本质是探究 qs 的各种序列化配置！qs库 的文档：https://www.npmjs.com/package/qs其提供了在线测试工具

我们在本地开发前端时，一般是执行 npm run serve 启动项目，控制台打印出如下日志： App running at: - Local: http://localhost:7007/ - Network: http://192.168.0.105:7007/怀着愉快的心情访问链接 http://localhost:7007/，浏览器也按我们预期显示了项目的主页面。当你不小心手误，访问链接时多敲了几个按键，链接变成这样：http://localhost:7007/asdf，一个回

本地开发一般通过执行 npm run serve 命令来启动项目，那这行命令到底存在什么魔法？我们来一探究竟。根据这篇文章思路：使用vue-cli初始化后运行npm run server到底干了什么得知，npm run serve 实际上会执行 vue-cli-service serve（该文件位于 node_modules.bin\vue-cli-service.cmd），查看该文件，发现最终会执行 node vue-cli-service.js serve（该文件位于 node_modules@vu

使用vscode调试vue-cli项目，参考：VSCode调试模式项目空间下创建 .vscode\launch.json 文件node方式调试launch.json文件内容如下：{ "version": "0.2.0", "configurations": [ { "type": "node", "request": "launch", "name": "Launch Program", "program": "${workspaceF

多环境简介官方文档：https://cli.vuejs.org/zh/guide/mode-and-env.html环境文件的命名规则：.env # 在所有的环境中被载入.env.local # 在所有的环境中被载入，但会被 git 忽略.env.[mode] # 只在指定的模式中被载入.env.[mode].local # 只在指定的模式中被载入，但会被 git 忽略文件中以"键=值"的形式配置环境变量，如果不同文件存在同

运行 npm install 安装依赖时报错，异常信息如下：npm ERR! code EINTEGRITY npm ERR! sha1-xxxxxx integrity checksum failed when using sha1: wanted sha1-xxxxxx but got sha512-xxxxxx sha1-yyyyyyy. (10379 bytes)解决方式一：直接删除 package-lock.json 文件，重新执行 npm install 即可。博主在尝试了各种方式无果后

目前项目开发方式基本采用前后端分离的方式。前端作为一个独立的项目，一般是使用Webpack方式进行编译打包生成 dist 目录（特指vue项目），再通过Nginx单独进行部署。为了和基于Docker的部署方式有个对比，我们先来说下服务器部署方式服务器部署方式一般来说，常规的部署方式的流程基本如下：服务器环境配置及安装 nginx将项目dist目录上传到服务器的指定位置修改 nginx安装目录/conf/nginx.conf 文件，配置dist目录及后端项目的代理地址启动nginxok搞定，

axios.js 调用案例post 请求发送json数据“Content-Type”: “application/json”const axios = require('axios');const qs = require('qs');axios.post(`http://localhost:8080/case/array`, { "id": "aaa" }) .then(function (resp) { console.log("response", resp.d

后台写了个接口，有一个数组类型的参数。想着通过 axios.js 进行调用，刚开始写出如下代码：const axios = require('axios');axios.get(`http://localhost:8080/get`, { params: { "ids": ["a1","a2"] } }) .then(function (resp) { console.log(resp); });可惜，gg，上面的写法实际请求的 url 为 http

前提node环境说明本文使用 express 模块来启动web服务器。Express官网：https://www.expressjs.com.cn/极简嘛，所以，此案例直接通过shell窗口操作。当然啦，你也可以使用VSCode或者其他IDE工具。正文新建一个空目录。本示例新建个名为 node-server-demo 目录。进入到该目录，打开一个shell终端。（window系统：进入目录，按住shift键，右键，在此处打开Powershell窗口）在终端执行 npm

使用 crypto-js 库官方文档：https://cryptojs.gitbook.io/docs/github：https://github.com/brix/crypto-js项目引入 crypto-js 库npm：npm install crypto-jsimport CryptoJS from ‘crypto-js’js：https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.0.0/crypto-js.min.js测试在线测

文章目录系列文章可分页表格组件功能列表使用案例相关代码在线演示地址其实，这篇是总结帖。系列文章分页表格组件动态列分页表格组件（动态控制表格列的显隐）后端分页表格组件终极分页表格组件（前/后端分页、动态列）可分页表格组件其实在第三篇文章（后端分页表格组件）的组件就已经是一个基本完善的分页表格组件了（自我感觉良好）。下面列举下其功能：功能列表兼容 <el-table&...

文章目录在线演示地址组件代码使用案例系列文章此案例基于 基于element-ui的 动态列分页表格组件（动态控制表格列的显隐），增加了后端分页的功能。实现思路：后端分页就是前端传递页码和每页条数两个参数到后台进行查询，返回的数据仅仅包含当前页的数据。（不同于前端分页，一次性查询所有数据）所以，当页码和每页条数变化时，都需要触发后端分页查询的方法，然后再处理分页数据。后端分页查询方法是在父组...

标题换一种说法：vue $emit 调用父组件异步方法，执行完毕后再执行子组件的某方法使用回调的形式异步方法执行完成的时间只有父组件知道，如果子组件需要在异步方式执行之后执行某些逻辑，那么只能将这些逻辑封装成一个方法传递到父组件，由父组件来触发执行。父组件// 父组件的html中添加事件 @getData="getData"methods : { getData(params, c...

文章目录单文件在线编辑器项目级在线编辑器推荐两个前端代码在线编辑器单文件在线编辑器：https://codepen.io/pen/项目级在线编辑器：https://codesandbox.io/单文件在线编辑器相信使用 element-ui组件库的小伙伴应该知道 codepen在线编辑器，因为element-ui默认的在线案例都是通过 codepen提供。以下是<el-table&...

文章目录组件代码使用案例系列文章此案例基于 基于element-ui的分页表格组件，增加了动态列的功能。墙裂建议按顺序食用。实现思路：实现动态列本质上是控制列的显隐状态，如果是使用jQuery的话，无非是操作dom。目前使用的是vue，其屏蔽了dom的操作，允许我们通过变量间接的操作dom。之前实现过一个版本，形式类似这位仁兄写的博文（此链接），而且我是封装成了组件，父子级组件的数据、属性设...

基于element-ui的分页表格组件化

比如：想使用 SockJs，则需要引入SockJS 的 js 文件<script src="https://cdn.jsdelivr.net/npm/sockjs-client@1/dist/sockjs.min.js"></script>在console中输入几行代码，完成js引入var script = document.createElement('scrip...

html<div><span> 123456789</span><span class="translate"> 123456789</span></div>css 文本中轴定位div{ position: relative; height: 200px;}span,div { borde...

var time = new Date();time.getTime()1567411847439time.toDateString()"Mon Sep 02 2019"time.toGMTString()"Mon, 02 Sep 2019 08:10:47 GMT"time.toISOString()"2019-09-02T08:10:47.439Z"time.toJS...

官网：https://harvesthq.github.io/chosen/实例化$(".chosen-select").chosen({disable_search_threshold: 10});赋值var optValue = $(".chosen-select").val();回显1.设置回显的值$(".chosen-select").val(“opt1”);2.触发cho...

1、datatables infomation不显示官方文档：https://datatables.net/reference/option/info官方文档写着 info 属性默认值为true，但是实例化后默认没有显示，只有显式设置才会显示，如下：info: true,...

cmd 执行lessc命令，报错 “less.js-windows-master\bin\node.exe&amp;amp;quot; 不是内部或外部命令，也不是可运行的程序”1、检查 “***\less.js-windows-master\bin\” 路径下有没有node.exe （笔者发现确实 路径不存在这个文件node.exe。 在“***\less.js-windows-master”路径下发现有个 bui...

http://blog.sina.com.cn/s/blog_95fa28e60101mwup.html

来源：JS对象转URL参数(原生JS和jQuery两种方式)现在的JS框架将ajax请求封装得非常简单,例如下面:$.ajax({ type: &amp;amp;amp;quot;POST&amp;amp;amp;quot;, url: &amp;amp;amp;quot;some.php&amp;amp;amp;quot;, data: { name: &amp;amp;amp;quot;John&

案发情景： 1、日期控件，设置了日期的格式 value-format=”yyyy-MM-dd”&amp;amp;amp;amp;amp;amp;amp;amp;lt;el-date-picker v-model=&amp;amp;amp;amp;amp;amp;amp;quot;form.regDateBeg&amp;amp;amp;amp;amp;amp;amp;quot; type=&amp;amp;amp;amp;amp;amp;amp;quot;date&amp