前端笔记
熊叁(san)
宁静致远
展开
-
vant-weapp dialog弹层before-close的用法
vant-weapp dialog弹层before-close的用法原创 2023-07-27 15:14:27 · 965 阅读 · 0 评论 -
用js把地区字符串格式化为省、市、区
因为直辖市、特别行政区的地名比较短,方便使用,就把这类地区存入city字段中了。用js把地区信息格式化为省、市、详细信息,结果如下。原创 2023-07-26 11:05:24 · 607 阅读 · 0 评论 -
uni-app开发环境跨域的解决方案(vue3 + vite)
uni-app开发环境跨域的解决方案(vue3 + vite)原创 2022-12-29 15:38:17 · 2687 阅读 · 2 评论 -
vue 动态绑定图片地址不显示的处理方法
vue 动态绑定图片地址不显示; :src不显示原创 2022-02-11 17:52:45 · 2200 阅读 · 1 评论 -
Vue Router 嵌套路由页面跳转
嵌套路由写法与编程式导航跳转。需要注意文档上的一句话:“要注意,以/开头的嵌套路径会被当作根路径”1. 路由写法routes = [{ path: '/', redirect: '/index'}, { path: '/index', component: () => import('../views/index.vue')}, { user: '/user', redirect: '/user/home', compo..原创 2021-12-06 14:46:06 · 1540 阅读 · 0 评论 -
vue中http请求携带页面路由的问题
vue 请求地址 页面路由原创 2021-12-06 14:23:56 · 2320 阅读 · 3 评论 -
nginx配置缓存以及判断缓存是否生效(摘抄)
原文链接https://www.cnblogs.com/ttyypjt/p/10065663.html怕以后找不到,所以抄过来了。。。location ~.*\.(js|css|html|png|jpg|gif)$ { expires 3d;}expires 3d; //表示缓存3天expires 3h; //表示缓存3小时expires max; //表示缓存10年expires -1; //表示永远过期。如果设置为-1在js、...原创 2021-06-23 15:50:54 · 2522 阅读 · 0 评论 -
本地nginx处理vue开发时因为跨域而无法保set-cookie的问题
以往用vue开发时,处理跨域问题只需要在xue.config.js文件中配置proxy即可,如下devServer: { open: true, //是否自动弹出浏览器页面 // host: "localhost", port: '8080', https: false, //是否使用https协议 hotOnly: false, //是否开启热更新 proxy: { //开发环境 '/api': {原创 2021-03-15 15:39:07 · 1378 阅读 · 0 评论 -
nginx在window上的简单操作
win+R启动CMD,然后进入nginx目录启动:satrt nginx.exe停止:nginx.exe -s stop重启:nginx.exe -s reload查看进程:tasklist杀死nginx进程: tskill nginx原创 2021-03-15 15:36:44 · 232 阅读 · 0 评论 -
js数字小数点后的0丢失
今天做金额计算,接口请求来的数据里数字是保留两位小数的,但是输出在控制台小数点后的0丢失了,这时候可以用如下方法补全:NumberObject.toFixed(num)toFixed() 方法可把 Number 四舍五入为指定小数位数的数字;num是小数位数,取值0-20保留两位小数:let price = 5;price.toFixed(2)...原创 2020-06-05 16:30:20 · 4378 阅读 · 8 评论 -
vue-i18n + element-ui 多语言配置
vue-i18n配置 + element-ui多语言配置:直接上demo:https://gitee.com/xxsheep/vue-i18n(拉下来安装依赖可以直接运行起来)vue-i18n 官网:http://kazupon.github.io/vue-i18n/zh/introduction.html,看文档即可。主要是element-ui的多语言配置:1.建一个多语言文件目录2.index.jsimport Vue from 'vue';import VueI18n.原创 2020-06-03 17:57:47 · 968 阅读 · 0 评论 -
组织架构图
js写一个这样的组织架构图,下面是代码1.插件官网https://balkangraph.com/(官网上说有收费版,但是下载的是免费版的)可以下载js文件,也可以用npm安装cnpm i @balkangraph/orgchart.js2.修改成自己想要的样式(因为没太多时间,只简单的改成了自己要做的样子,也没有好好处理代码,该文件可直接复制使用,setTemp是修改模板...原创 2020-03-19 17:55:54 · 2905 阅读 · 2 评论 -
js字符串补全
ES6有两个字符串的方法,很好用,脑袋不好用,记下来1.字符串补全(在字符串的前面补充)String.padStart(length, str)参数 格式 说明 length Number(integer) 最终字符串的长度 str String 要补充的字符串 该方法在时间格式化时给小时、分钟前面补0很好用...原创 2020-03-18 23:51:16 · 1590 阅读 · 0 评论 -
直接下载txt文件而不是打开它
js下载txt文件,而不是在浏览器中打开它使用axios方法下载(关键点在于指定使用blob)downloadTxt(url) { axios.get(url, {responseType: 'blob'}).then(res => { let blob = new Blob([res]); let url = window.URL.crea...原创 2020-03-13 00:56:14 · 3887 阅读 · 8 评论 -
vue具名插槽接收数据(作用域)
vue具名插槽接收传来的数据,写法插槽写法:<slot name="slotName" :data="dataDict"> <span>无插槽时显示内容</span></slot>模板写法:<template v-slot:slotName="{data}"> <div> ...原创 2020-03-11 01:19:17 · 1901 阅读 · 0 评论 -
vue项目使用cdn
webpack构建vue项目,使用cdn的方法:在vue.config.js中添加如下配置(复制后直接放在exports对象中)configureWebpack:{ externals: { 'vue': 'Vue', 'vue-router': 'VueRouter', 'axios': 'axios', // '...原创 2020-03-07 18:31:19 · 1376 阅读 · 0 评论 -
把选择的图片文件显示在页面上
vue方法来写<img v-if="imageUrl" :src="imageUrl" alt=""><input @change="logoChange" style="display:none;" type="file" ref="logoFile" accept="image/*">logoChange(){ let file = this.$r...原创 2020-03-01 12:03:49 · 533 阅读 · 0 评论 -
正则表达式不包含特殊字符
1-8个字!不能包含以下字符:\/:*?<|'%>/^((?!\\|\/|:|\*|\?|<|>|\||'|%).){1,8}$/原创 2020-03-01 00:21:28 · 19715 阅读 · 0 评论 -
vscode插件失效
今天发现vscode的vetur不提示了,昨天用的好好的,今天就不行了,然后,处理方法如下1.回退版本2.禁止vscode自动更新插件原创 2020-01-15 13:12:30 · 2040 阅读 · 1 评论 -
js递归返回想要的值
递归返回想要的值 /** * 递归数组返回想要的值,返回所有匹配到的节点组成的数组 * @param {Array} list 要递归的数组 * @param {String} childKey 子集字段 * @param {String} key 要匹配...原创 2020-01-14 01:36:36 · 3765 阅读 · 1 评论 -
一行文字多出的显示省略号
一行文字多出的显示省略号。p{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}原创 2019-12-09 22:14:35 · 511 阅读 · 0 评论 -
兼容Ie9使元素在父级中均等分布
刚要兼容ie9,使得元素在父级中均等水平分布。一直用flex,很久没兼容ie9及其以下版本了,几年前的知识已经忘了,赶快翻开笔记看看<ul> <li></li> <li></li> <li></li></ul>ul{ display: table; ...原创 2019-12-09 22:12:01 · 170 阅读 · 0 评论 -
window.open下载不打开新窗口
open的第二个参数是 '_self' 即可window.open(url,'_self');原创 2019-11-30 18:16:17 · 8487 阅读 · 1 评论 -
axios以blob格式下载文件
1.axios的post方法中responseType的默认值是“json”,改为“blob”即可。axios.post(url, data, {responseType: 'blob'}).then(function (response) { callback(response);})2.在成功的回调中可以这样写callBack(res){ let blob ...原创 2019-11-28 09:41:39 · 1673 阅读 · 0 评论 -
解决element-ui form 输入后绿色(成功状态)消失的问题
element-ui form表单 输入后成功状态消失的问题,这不是问题,是element-ui版本更新后把这个样式去掉了。安装2.9.2以及之前的版本即可恢复卸载element-uinpm uninstall element-ui安装指定版本的element-uicnpm install element-ui@2.9.2 -S...原创 2019-11-12 21:55:07 · 2609 阅读 · 2 评论 -
使元素垂直水平居中与浏览器窗口
第一次写博客,仅仅为我自己看,方便记忆一、使元素相对于浏览器窗口水平垂直居中有三种方法:1.用table-cell设置元素,并且 vertical-align: middle;text-align: center;2.用相对定位:相对定位 position: relative;left: 50%;top: 50%;(使元素的左上角居于窗口中心)用margin使元原创 2016-10-25 12:54:00 · 1576 阅读 · 0 评论 -
JQ中的hover、mousexx的区别
JQ中:hover() :当鼠标移入的时候.......,移出的时候.....;可以只发生移入事件。mouseenter() :当鼠标进入的时候.....;mouseleave() : 当鼠标离开的时候......;hover() 等于 mouseenter() + mouseleave() ,效果完全相同;特别指出的是:上面两种方法,都是进入该元素内部,包含其所有子元素。进原创 2016-11-10 23:28:40 · 1041 阅读 · 0 评论 -
DOM操作总结
17. .createElement( ) 创建一个元素(DOM节点) 如:创建一个div标签 var div = document.createElement('div');18. .appendChild( ) 往指定节点下添加一个子节点。19. .insertBefore( ) 把某节点移动到指定节点的前面。20. .removeChild( ) 删除某个子节点。21. .replaceChild( ) 替换某个子节点。原创 2016-11-15 09:44:23 · 436 阅读 · 0 评论 -
使IE使用固定的渲染模式
IE浏览器从IE8开始添加了兼容模式,开启后会以低版本的IE进行渲染。兼容模式有可能会导致网页显示出问题,于是我们通常在HTML中添加下列代码来使 IE 使用固定的渲染模式: 还有一种情况,在IE8下只有不使用兼容模式页面才能显示正常,但是如果设定为IE8的模式,在IE9中却会导致CSS3失效。看来,需要针对 IE8、IE9 分别 禁用兼容模式。怎么办呢?可以在后台判断浏览器版本,如果是转载 2016-11-29 16:39:28 · 762 阅读 · 0 评论 -
数组中数字的排列大小
从大到小(或从小到大)排列一个数组中的数字代码:(从大到小排列)var arr = [1,3,2,5,10];var result = arr.sort(function(x,y){ return x-y;})console.log(result);若要实现从小到大排列,用(y-x)即可。sort()的用法:sort() 排序;对数组中的元素进行排列,默认是以字符串的原创 2016-11-16 18:42:58 · 6007 阅读 · 0 评论 -
事件冒泡
阻止事件冒泡: event下有一个cancelBubble属性,其意义为:是否阻止冒泡事件,默认值是false(不阻止)。事件冒泡发生的情况: 有嵌套关系,并且两者都有相同的触发事件(触发后所要执行的事件可以不相同),触发子级时,自己的执行事件完成后会继续会触发其父级,进而把父级该触发事件所对应的执行事件也执行了,执行完之后如果还有父级,会继续往上触发,直到document。原创 2016-11-17 22:20:12 · 441 阅读 · 0 评论 -
函数传参
函数传参: 把一个(变量)参数传入函数中,就叫做函数传参。对参数无任何限制,可以是六大数据类型。比如:要分别弹出1+5,2+5,3+5的值可以这样写: function add1(){ var result = 1 + 5; alert(result); } add1(); function add2(){ var result = 2 + 5;原创 2016-11-18 08:41:42 · 557 阅读 · 0 评论 -
H5中video标签
media事件:由媒介(比如视频、图像和音频)触发的事件(适用于所有 HTML 元素,但常见于媒介元素中,比如 、、、 以及 ):onloadedmetadata 当元数据(比如分辨率和时长)被加载时运行的脚本。用法:在 HTML 中:SomeJavaScriptCode">在 JavaScript 中:audio|video.onload原创 2016-12-01 21:07:23 · 571 阅读 · 0 评论 -
作用域与作用域链
作用域:作用域就是变量与函数的可访问范围(一个变量起作用的地域范围)。作用域分为:全局作用域、局部作用域。作用域的属性:1.一个函数就是一个独立的作用域;2.如果在函数内部定义一个变量,在这个函数的外部是访问不到这个变量的;3.一个变量只在当前函数与其所在的函数的子函数中能够被访问到;4.全局变量,不属于任何一个很熟,能够在任何地方被读取或设置。作用域链:一个函原创 2016-11-20 14:01:09 · 425 阅读 · 0 评论 -
sublime快捷键(复制来的)
Sublime Text 3 快捷键精华版Ctrl+Shift+P:打开命令面板Ctrl+P:搜索项目中的文件Ctrl+G:跳转到第几行Ctrl+W:关闭当前打开文件Ctrl+Shift+W:关闭所有打开文件Ctrl+Shift+V:粘贴并格式化Ctrl+D:选择单词,重复可增加选择下一个相同的单词Ctrl+L:选择行,重复可依次增加选择下一行Ctrl+Sh转载 2016-12-19 15:49:18 · 2959 阅读 · 0 评论 -
angularJS中repeat数据不能出现重复项解决
angularJS中repeat的数组数据不能出现重复项,代码本应该是这样的:解决方法: 在" x in attr "后面直接加上" track by $index "即可。改过的代码如下:原创 2017-01-15 18:38:03 · 2185 阅读 · 1 评论 -
js进制转化
//十进制转其他 var x=110; alert(x); alert(x.toString(8)); alert(x.toString(32)); alert(x.toString(16)); //其他转十进制 var x='110'; alert(parseInt(x,2)); alert(parseInt(x,8)); alert(parseInt(x转载 2017-02-07 15:35:56 · 287 阅读 · 0 评论 -
 兼容性(空格兼容性)
 在Chrome于firefox下显示的宽度不同,原因是两个浏览器的默认字体不同,给html规定字体即可解决。下面有各种形式的空格,各有不同: : 不换行空格,按下空格键所产生的空格,受字体影响明显;&ensp: 半角空格 ,em宽度的一半(一个小写字母的宽度),基本不受字体影响;&emsp: 全角空格 ,一个em宽度(一个中文宽度),基本不受字体影响;原创 2017-01-17 16:43:56 · 1130 阅读 · 0 评论 -
angular 路由,ui-router,ocLazyLoad的使用
angular按需加载js、css,动态加载js,angular 路由,ui-router,ocLazyLoad的使用.原创 2017-02-17 11:27:07 · 5167 阅读 · 0 评论 -
路由,随页面加载js脚本
有些时候,我们不想让某些js脚本在网页开始的时候就加载进来,只需要当用到某个页面的时候再同时加载此页面的js脚本,这时候就可以在html中写如下代码,把用到的js脚本插进去(据查资料,这属于js异步加载,关于js异步加载,还需进一步学习) (function() { var s = document.createElement('script'); s.typ原创 2017-01-19 17:53:20 · 842 阅读 · 0 评论