![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
学习笔记
flyyy菜鸟
应届生、、菜鸟
展开
-
vue移动组件vant官网打不开的解决方法
1.:在站长工具中检测vant的dns,站长工具的地址:站长工具DNS查询链接2. 复制紫色框中的ip,应该是复制其中的任一个都行3. 以管理员身份运行 打开hosts文件,一般hosts文件路径:C:\Windows\System32\drivers\etc\hosts添加箭头指的内容,保存后重新打开vant的官网即可...原创 2020-09-24 10:24:15 · 3305 阅读 · 1 评论 -
async await的使用方法
async & await是ES7中提出的新语法作用是将异步代码以同步的方式进行书写await的用法:用来修饰异步代码,让其以同步的方式进行书写async的用法:用来修饰await所在的函数//await用法://传统代码:axios.get('/login').then(res=>{})//用await修饰let res = await axios.get('/login') //async用法async function login(){ l..原创 2020-08-08 11:12:12 · 227 阅读 · 0 评论 -
vant+vee-validate校验的基本使用
main.js//导入:import VeeValidate,{Validator} from 'vee-validate';//方言包import zh_CN from "vee-validate/dist/locale/zh_CN.js";Vue.use(VeeValidate,{ event:"blur"});//events为空//Vue.use(VeeValidate, {// events: "" // 禁用校验事件//});//使用方言包Validato.原创 2020-08-08 10:20:24 · 1727 阅读 · 0 评论 -
阿里云服务器远程连接
登录阿里云服务器,选择实例,点击右边的远程连接输入密码登录,可直接修改远程连接密码登录成功后,需要输入登录名和密码,linux用户默认登录名是root,windows默认是administrator,密码是实例密码,忘记了可以直接在实例列表中重置输入登录名和密码后即连接成功项目部署说明登录服务器ssh root@ip如果连接不成功,绑定密钥对,通过ssh -i 密钥路径 root@ip访问进入服务器根目录cd /安装nginxyum install nginx查看ngin.原创 2020-07-13 21:15:27 · 490 阅读 · 0 评论 -
less混合函数
less的混合函数与sass的混合函数语法不太一样/*定义变量,给定默认值*/.flex(@hov:space-between,@col:center) { display: flex; justify-content: @hov; align-items: @col;}/*调用*/.container { height:112px; .flex;}/*输出:*/.container { height:112px; display:flex; justify-cont原创 2020-07-11 23:38:50 · 193 阅读 · 0 评论 -
json-bigint处理大数字问题
js里面的整数有安全范围,即最大能显示的范围,超过了这个范围可能会精度丢失Number.MAX_SAFE_INTEGER //值为9007199254740991json-bigint:可以像JSON.parse一样方便转换用法://导入import JSONbig from 'json-bigint'//可以通过axios的transformResponse方法,这个方法的作用是在传递给then/catch前,允许修改响应数据//axios在这里默认把响应体从json字符串转.原创 2020-06-09 12:15:19 · 5967 阅读 · 1 评论 -
axios请求拦截、响应拦截,router导航守卫
axios请求拦截:可以在请求头统一添加token等axios.interceptors.request.use( function (config) { //从vuex中获取用户信息 let user = store.state.userForm; if (user) config.headers.Authorization = `Bearer ${user.token}`; return config; }, function (error) { ret原创 2020-06-08 18:07:37 · 544 阅读 · 0 评论 -
vue 过滤器filters
对文本进行处理:使用过滤器//局部过滤器 <template> <div class="son"> <input type="text" v-model="msg"> {{ msg | formatName }} </div> </template> <script> export default { data() { return { msg:'' } }, filters原创 2020-06-08 16:57:48 · 187 阅读 · 1 评论 -
es6中的导入导出
默认导入导出:导出:export default 数据导入:import 名字 from 路径导入时的名字可以随便写导入的是默认暴露的那个值按名字导入导出导出:export const 名字 = 数据导入:import { 名字 } from 路径导入的时候加了大括号一定是按名字,没有大括号一定是默认...原创 2020-06-08 16:37:52 · 277 阅读 · 0 评论 -
sticky footer 实现页脚块位置根据页面内容长度变化
sticky footer,指的是当页面内容不够长的时候,页脚的位置粘贴在视窗底部;当页面内容足够长时,页脚块会被内容向下推送,位置显示在内容下方,不会遮挡内容sticky footer比较常用的布局方式如下:<div class="detail"> <!--外层的这个wrapper与底部区域同级--> <div class="detail-wrapper clearfix"> <div class="detail-main"> <!-原创 2020-05-16 15:05:41 · 154 阅读 · 0 评论 -
图片背景模糊效果filter的实现
给一个div添加背景图片(img标签),并且有模糊效果,部分代码如下:html结构为:<div class="header"> <div class="bg"> <img src="./bg.png" alt="" width="100%" height="100%"> </div></div>样式如下,特别注意需要设置z-index为-1.header { position:relative; overflo原创 2020-05-15 17:36:17 · 845 阅读 · 0 评论 -
在less中使用background-image时,url的设置问题
本来尝试了一下es6的模板字符串,然后也没成功.bg-image(@url) { background-image: ~"url(@{url}@2x.png)"; @media(-webkit-min-device-pixel-ratio:3),(min-device-pixel-ratio:3){ background-image:~"url(@{url}@3x.png)"; }}在less中,符号 ~ 后面的双引号的内容会被less编译时忽略less的符号 @ 和 {}原创 2020-05-15 15:35:25 · 3636 阅读 · 1 评论 -
伪类+缩放 实现1像素的下边框(使用less)
如果直接给一个1像素的border,在pc端浏览是真的1像素,如果在手机端浏览,就不是1像素,因为手机端的物理像素是设备像素的两倍,所以在375像素下的手机显示的是2像素的border(设计稿一般是750)这里把伪类和缩放的样式放在两个不同的less文件中伪类:主要是给父元素添加after伪类,伪类绝对定位来实现/*mixin.less 样式根据自己的需求来写*/.border-1px(@color) { position:relative; &::after { conte原创 2020-05-15 09:55:54 · 500 阅读 · 0 评论 -
vue项目中使用less时报错TypeError: loaderContext.getResolve is not a function
vue项目中,使用 npm install less less-loader --save-dev 安装好less写上lang=“less”<style lang="less"></style>启动项目npm run dev后报如下错误:原因:less-loader版本过高,在package.json中看到我安装的less-loader的版本是6.x,所以安装低版本的less-loader即可 npm install less-loader@4.1...原创 2020-05-14 12:52:24 · 957 阅读 · 0 评论 -
vue报错 Do not use built-in or reserved HTML elements as component id:header
在vue项目中使用组件时,组件名不能和html标签重复,header是h5中的新标签,所以组件名不能是header原创 2020-05-14 12:28:16 · 349 阅读 · 0 评论 -
webpack配置:devServer中的before方法的作用
新版本的vue中已将dev-server.js与webpack.dev.conf.js合并,所以在dev-server.js的配置可以写在webpack.dev.conf.js/*webpack.dev.conf.js*/const devWebpackConfig = merge(baseWebpackConfig,{ devServer: { //before方法:能够在其他所以的中间件之前执行自定义的中间件 before(app) { app.get('/api/goods', fu原创 2020-05-14 09:49:25 · 11800 阅读 · 0 评论 -
将svg图片转为字体图标
icomoon链接 通过icomoon将svg图片转为字体图标的步骤如下:点击icomoon app按钮点击import icons按钮,导入svg图选中导入的svg图,点击右下角的generate font在这个页面中,点击preferences可以修改字体图标名,前缀等等,点击get code可以查看字体图标的使用方法点击download下载字体图标下载并解压缩后根据demo.html查看使用方法,最后将文件拷贝到项目中使用...原创 2020-05-14 08:39:46 · 1613 阅读 · 1 评论 -
pc端判断是32位还是64位系统
var agent = navigator.userAgent.toLowerCase();if(agent.indexOf("win64") >= 0 || agent.indexOf("wow64") >= 0 ) { console.log('64位');}else { console.log('32位');}原创 2020-04-27 15:59:04 · 204 阅读 · 0 评论 -
面试题:前端性能优化
目的:让页面加载速度更快,提高用户体验减少http请求,使用缓存图片懒加载压缩、合并文件,避免空src,因为空src会重新加载页面,影响速度外部脚本置底css文件置顶...原创 2020-04-15 16:17:46 · 119 阅读 · 0 评论 -
面试题:在浏览器输入一个url经历哪些过程
发送http请求前进行域名解析(DNS解析),获取相应的ip地址浏览器向服务器发起连接,建立tcp三次握手浏览器向服务器发送请求,请求数据包服务器收到请求,返回数据浏览器收到http响应,解析html源码生成DOM,解析css,js...原创 2020-04-15 16:05:54 · 778 阅读 · 0 评论 -
面试题:this的指向问题
非严格模式下this指向默认是window,严格模式下默认是undefined普通函数调用this指向全局对象window对象函数调用谁调用this就指向谁构造函数调用this指向实例对象箭头函数箭头函数的this是在定义函数的时候绑定的,不是在执行过程中绑定可以解决匿名函数和定时器的this指向问题,不用用变量that储存this示例:v...原创 2020-04-15 16:02:34 · 2505 阅读 · 0 评论 -
面试题:从输入url到展示的过程
发送到dns,获取域名对应的web服务器对应的ip地址浏览器与服务器建立tcp连接(三次握手)浏览器发生http请求服务器接收请求,返回响应数据浏览器接收、下载数据,解析html源文件生成DOM,解析css、js文件,渲染页面...原创 2020-04-15 13:19:39 · 117 阅读 · 0 评论 -
130 个相见恨晚的超实用网站,一次性分享出来
130 余个相见恨晚的超实用网站文末没有公众号...转载 2020-03-14 15:57:45 · 725 阅读 · 0 评论 -
TCP传输的三次握手和四次挥手
三次握手第一次:客户端向服务器发起连接请求,表示客户端想要和服务端进行连接第二次:服务端收到请求后发出确认报文,询问浏览器是否准备好第三次:客户端收到确认报文后再给服务端发出确认信息,表示已经准备好连接四次挥手客户端发送关闭连接的请求服务端收到请求后返回确认,目前是处于半关闭的情况,这个时候服务端向客户端发送数据的话客户端仍然要接收服务端将最后的数据发送完后向客户端发送连接...原创 2020-03-14 13:02:42 · 86 阅读 · 0 评论 -
使用axios发送get、post请求
get请求方式一axios.get('/login?userId=111') .then(res=>{ console.log(res);}).catch(error=>{ console.log(error);})方式二,通过params传axios.get('/login',{ params:{ userId: 111 }}) .th...原创 2020-03-10 10:17:44 · 709 阅读 · 0 评论 -
面试题:前端跨域的解决方案
方式一:corscors的原理:服务器返回响应的时候在响应头设置一个允许跨域的header:Access-Control-Allow-Origin,可以自己使用中间件写,也可以使用第三方包cors方式二:jsonpjsonp是利用script标签的src属性,向不同源的接口发送一个get请求,携带一个回调函数callback,函数的值是在html页面定义的函数的函数名,服务器接...原创 2020-02-28 23:32:30 · 1620 阅读 · 0 评论 -
踩坑:使用jquery的data()方法获取不到自定义属性的值
<a href="" class="regBtn" data-btn="1">点击</a> <a href="" class="regBtn" data-btn="2">点击</a> <a href="" class="regBtn" data-btn="3">点击</a> <a href="...原创 2020-02-15 22:03:27 · 1412 阅读 · 0 评论 -
在vscode中配置终端集成bash
使用ctrl + shift + p 快捷键,搜索settings(json),如图:在settings(json)中输入"terminal.integrated.shell.windows":“bash.exe所在地址”,,如图:重启vscode即可原创 2020-02-12 20:25:57 · 2232 阅读 · 0 评论 -
实现图片预览的三种方式
1.使用FileReader给input注册值改变事件获取到文件,创建FileReader对象注册load事件预览:把结果得到的路径给预览的标签转为base64格式this.$refs['file'].onchange = () => { let myFile = this.$refs['file'].files[0]; let reader = new FileRead...原创 2020-02-04 12:00:37 · 887 阅读 · 0 评论