- 博客(63)
- 收藏
- 关注
RSS订阅原创 动态修改浏览器地址栏，并保持页面不刷新
需求：浏览器地址栏跟随输入框的变化而变化。需求背景：客户A需要将地址和查询条件一起分享给客户B。如下图第一种方式：vue技术栈的话，使用路由的小技巧router.push方法中只push一个query既可以实现，但是会更新表单组件，不会更新父组件可以在各组件的生命周期函数中观察更新效果。去实现：// 表单数据data(){ return { formData:{ name:'', sex:''
2021-04-09 09:32:25
2903
原创 js实现图片压缩上传
javascript 处理图片压缩和上传最近在研究H5前端图片处理相关技术，方向有图片压缩、裁切、旋转、模糊等，现在已经整理成对应的demo，上传至github。下载即用，欢迎大家参考和指导。一：js脚本实现图片压缩 -CompressImageUtiles特点：1 体积小，4kb；2 支持blob格式上传和base64格式上传原图 5.4MB ...
2021-04-02 16:15:20
5806
4
原创 看一遍 记住 a++与++a
let a = 1; a++; console.log(a) // a = 2 let b = 1; ++b; console.log(b) // b = 2 let c = 1; let _c = c++; //此时是先赋值在运算，即先执行表达式在运算 。速记：谁在前先执行谁 如c在前就先算 c赋值 _c = c,再计算 c++ con...
2021-02-27 17:15:50
303
原创 vue-cli打包优化之分析工具webpack-bundle-analyzer
// 1. 安装 cnpm install webpack-bundle-analyzer --save-dev// 2. 在/build/webpack.prod.conf.js文件中引入 const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin// 然后配置一下： plugins: [ new BundleAnalyzerPlugin() ]// 3. 在package.json文
2021-02-26 15:46:18
478
原创 js浏览器消息通知接口Notification
HTML:<el-buttontype="primary"icon="el-icon-plus"@click="chromeMessageBtn">浏览器消息测试</el-button>Js: //浏览器消息推送 chromeMessageBtn(){ this.createNotify('测试通知',{body:'您收到一条新信息！',sticky:'true'}) }, createNot...
2020-11-19 16:00:58
1494
原创 vue style中 import 与 src 用法
直接上干货：1、src<style lang="scss" scoped src="./index.scss"></style>2、import<style lang="scss" scoped >@import "./index.scss"</style>两种写法均可...
2020-03-13 12:16:38
4153
1
原创 vue 打印插件
1、安装npm installvue-print-nb --save2、全局引入并注入 import Print from 'vue-print-nb' Vue.use(Print)3、使用打印按钮指令v-print<el-buttonv-print="'#printDom'">打印</el-button>要打印的dom&...
2020-02-27 16:46:32
3326
1
原创 github使用报错汇总
1、本地和远程均为自己的开发账号：1.1、没有设置秘钥或者本地秘钥已经失效 ----> 去重新生成2、连接公司或者团队的github失败2.1、确保自己的账号已经被管理员开通权限2.2、确保自己的用户名和密码正确 不确定的话 可以重新改密码 可以修改用户名 ；再重试。2.2、配置用户名和邮箱 gitconfig--global...
2020-01-07 06:58:07
486
原创 vue项目 git上传忽略node_modules和dist
1、在项目目录下 右键 git bash here2、在命令行输入输touch .gitignore ，生成“.gitignore”文件3、在gitignore文件中输入.DS_Storenode_modules/dist/npm-debug.log.vscode/这些都是不用提交的ps：如果已经生成过了node-moduls 建议删除后 重新 npm in...
2019-12-13 11:39:49
7341
原创 vue-scss 安装步骤
1、在项目目录下打开cmd命令行2、输入cnpm install node-sass --save-dev3、然后输入 cnpm install sass-loader --save-dev4、再然后输入cnpm install style-loader --save-dev5、最后 打开build 目录下的webpack.base.conf.js文件 ...
2019-12-13 11:33:08
828
原创 vue filter 过滤器 详解
Vue.js 允许你自定义过滤器filter，可被用于一些常见的文本格式化。（注意vue版本号不同 用法也稍有不同）接下来咱们就记录一下最常用的filter过滤器用法。（该示例以多个过滤器为例，当然你也可以删掉第二个过滤器自行测试）1、首先再src目录下 新建目录 filter2、在filter目录下创建 文件 index.js文件，将项目中的所有过滤器函数统一管理在index.js...
2019-11-21 11:38:51
2143
1
原创 vue项目搭建连载教程+全家桶详解----第三节：vue-cli 项目结构目录介绍
上节咱们搭建好了vue项目，那么这节咱们接着讲解一下，使用cli脚手架工具搭建的vue项目都有那么目录结构1、先整体看一下2、从上到下依次来看 首先是build目录改目录下是打包配置和webpack配置，暂时不用深究,后面用到时咱们再详细说明3、config目录改目录下的文件用于配置开发环境和正式环境的域名端口等配置，4、node-modules目录该...
2019-10-30 10:20:35
405
1
原创 vue项目搭建连载教程+全家桶详解----第二节：搭建vue项目
接着上节内容,咱们配置好了所有环境，接下来就要开始搭建vue项目了。是不是跟我一样很鸡动啊！1、在d盘或者f盘下建立一个空目录，2、进入该目录下 在地址栏输入 cmd 回车 即可进入目标目录3、随后输入 vue init webpack 回车4、接下来很关键 看见 yes/no 参照下图输入 否则 一路回车5、如下图 成功后就可以启动项目了！ 输入 npm ...
2019-10-29 17:39:03
262
原创 vue项目搭建连载教程+全家桶详解----第一节：环境配置
初衷：鉴于很多从事前端的伙伴们对于vue技术理解不是很透彻，特增加这个vue教程连载，希望帮助更多的前端奋斗者！（ 后期会将项目上传到github 欢迎大家来捣乱！）第一篇：从零搭建vue项目1、nodeJS环境的安装，下载地址：https://nodejs.org/en/下载成功后 ,傻瓜式安装即可。2、安装成功后，环境变量配置2-1 回到桌面 右键我的电脑2-2 单击‘...
2019-10-29 16:05:12
376
原创 onload和ready的区别
window.onload :1、须等到页面、图片‘外引资源 全部 加载完毕后才能执行2、window.onload不能同时编写多个，只能执行一个$(document).ready()1、DOM结构绘制完毕后立即执行2、同一个文档可以写多个$(document).ready()理解：document对象是Window对象的一个属性，所以window整个对象的加载时...
2019-04-22 18:22:29
1843
原创 git 快捷键全局设置
git config --global alias.pl pull pl 代表 pullgit config --global alias.pspush ps代表 pushgit config --global alias.cmcommit cm代表 commitgit config --global alias.ckcheckou...
2019-04-10 13:58:44
1614
原创 git 操作大全
git 基本操作git add . --------添加文件至本地仓库git commit -m'本次提交代码注释' -------增加注释git pull ------拉取远程仓库最新的代码git push -----将本地仓库代码提交至远程仓库git 查看操作git status --------查看状态git branch ---...
2019-04-09 13:03:06
1048
原创 css flex弹性盒布局 实现一个左右宽度固定，中间自动撑开的布局
这种布局其实是挺常见的，今天也稍作总结。上代码<!DOCTYPE html><html lang="en"><head> <meta charset="gb2312"> <title>Title</title> <style>
2019-03-08 23:44:11
10426
原创 一个关于ul 及 li 横向滚动的故事！
哎！最近笨人又遇到了关于使用css3实现ul 横向滚动的问题了，知道很简单，突然间想不起来！灰常苦恼，就写下这篇文章来加深记忆！（当然我也在度娘上搜了一波，发现没有满意的答案，就把这篇文章分享给 同我一样奋斗在前端岗位上的各位同仁吧！）来来来！上干货！结构部分先写一个包裹层 div 在写一个包裹li的ul 最后写很多licss部分用到 文本不换行 white-space...
2019-03-08 23:24:13
2823
原创 rem自适应布局用法及详解
对于很多新同学来说，rem还是比较熟悉而又陌生的， 熟悉呢是因为rem时常出现在耳边，陌生呢是因为又搞不清原理。今天咱们一起来弄清楚rem到底是怎么一回事！原理：css3规定：1rem的大小就是根元素<html>的font-size的值。通过设置 根元素<html>的font-size的大小，来控制整个html文档内的字体大小、元素宽高、内外边距等， ...
2018-04-26 19:44:28
15006
7
原创 关于input在ios上调起软键盘，字体不显示问题 的总结
最近刚接手一个新项目，在做手机适配测试时候发现input 调起ios系统软键盘后，软键盘上面打不出来字体！很是纳闷！一开始就把IOS不兼容input及软键盘的可能性排除，然后一顿排查！终于发现问题所在了！原来是common.css里面加了这句话：* {-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:...
2018-03-22 17:56:13
3601
原创 jquery实现单选与多选
前言相信做前端的小伙伴们，多多少少都会遇到关于单选或者多选的问题，选择框大家也都不会陌生，无非就是radio和chechkbox，但是input的这两个属性都无法更改默认样式，有时候无法满足Ui设计出的高大上，真逼格的选择框样式，这时候就需要label标签来帮忙了。将label与input绑定一起来实现各种各样的优美选择框。上代码单选 .choose_r
2018-01-04 13:22:50
15511
6
原创 第一篇 开始
第一次写博客，没什么经验，只是记录下来工作中遇到的bug及其解决方案，希望能帮助自己，也希望能帮助到那些跟我一样默默奋斗在一线的程序员工程师们。。。
2018-01-04 12:58:58
265
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人