学习笔记
文章平均质量分 73
where_slr
这个作者很懒,什么都没留下…
展开
-
vue 监听菜单侧边栏折叠展开变化,响应Echarts图表resize问题
bug:vue项目中,窗口大小不变(排除window监听resize),侧边菜单栏折叠展开,导致右边内容区域宽度大小变化,echarts图表的宽度超出或者小于操作后的 原图表容器区域的宽度;常规解决办法的是监听窗口的变化window.addEventListener(“resize”),但当前bug是窗口不变,内部元素的宽度变化,所有window监听不生效。抽取的调用echarts图表resize方法 methods:{ //调用echarts的resize() onResize(){原创 2021-08-20 16:33:44 · 4309 阅读 · 0 评论 -
微信小程序获取用户位置坐标,调用腾讯地图api,转换成地区
需求:首页获取用户位置坐标,转换成功实际省市区,寄存在缓存中;项目开发使用的是美团的mpvue,谁用谁知道(坑有不少但对于习惯vue开发的,也挺友好!)小程序文档先上为敬腾讯地图注册获取key,配置,可参考例子1 例子2//注册配置完成,下载好微信小程序JavaScriptSDK v1.2,文件位置放好。头部引入,在onLoad 调用获取位置坐标方法,调用腾讯API转换成实际位置imp...原创 2020-03-04 11:51:18 · 3628 阅读 · 0 评论 -
vue中使用videojs
参考1参考2原创 2020-02-06 19:00:19 · 4527 阅读 · 0 评论 -
easyMock+mockJs+postMan搭建测试接口
一、easyMockeasy mock(https://www.easy-mock.com/docs)平台的主要作用,是用来模拟生成json文件,在后端未到位的情况下,为前端调试提供数据。vue项目使用axios中:1、是在开发时将ajax请求,直接指向https://easy-mock.com/mock/59a578f77b7ac306cc2fa863/api这样的远程接口,进行调试2、...原创 2019-08-08 13:40:04 · 1443 阅读 · 0 评论 -
面试题,哈哈哈哈!
function getPersonInfo(one, two, three) { console.log(one); console.log(two); console.log(three);}const person = "Lydia";const age = 21;getPersonInfo`${person} is ${age} years old`;//['',...原创 2019-08-26 09:53:35 · 1148 阅读 · 0 评论 -
日常心得——js&jq
jq中使用点击事件嵌套重复,多次触发可以在触发前先解绑点击事件;$('div').off('click').on('click',function(){})swiper竖直循环var mySwiper1 = new Swiper('.div', { direction: 'vertical', autoplay: { delay:...原创 2019-08-26 09:53:47 · 399 阅读 · 0 评论 -
日常心得——css篇
动画循环往返.icon_delivery_man { position: absolute; top: 130px; left: 20px; display: inline-block; width: 42px; height: 41px; background: url("../images/lj/icon-electrombile2.p...原创 2019-08-26 09:53:55 · 280 阅读 · 0 评论 -
CSS——了解BFC
Formatting context 是 W3C CSS2.1 规范中的一个概念。它是页面中的一块渲染区域,并且有一套渲染规则,它决定了其子元素将如何定位,以及和其他元素的关系和相互作用。最常见的 Formatting context 有 Block fomatting context (简称BFC)和 Inline formatting context (简称IFC)。Block formatt...转载 2019-04-10 13:50:24 · 169 阅读 · 0 评论 -
移动端适配——pt,px
pt:逻辑像素或逻辑分辨率相当于我们用浏览器模拟调试移动端时看到的各手机的像素,如下图iPhone6看到的宽高375*667,这个就是逻辑像素,也可以看做是一个长度单位: px:物理像素或物理分辨率,又被称为设备像素下图的750*1334就是物理像素,它不能看做是一个长度单位,可以看做是一个点,即像素点 结论:pt和px的关系就是—— 1pt 里面有几个 像素点...转载 2019-04-10 10:57:49 · 3791 阅读 · 0 评论 -
CSS——inline-block引起的空白间隙
使用display:inline-block;布局时,如果遇到换行/空格符等其他字符时,会有出现空白间隙; <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport&qu原创 2019-03-04 15:46:15 · 367 阅读 · 0 评论 -
Vue开发注意点
1、给路由绑定点击事件 &lt;a href="javascript:;" @click="linkToServiceAgreement()" class="link_service_agreement"&gt;链接&lt;/a&gt; methods:{ linkToServiceAgreement() {原创 2019-08-26 09:53:20 · 269 阅读 · 0 评论 -
Js——异步方法宏任务(task)与微任务(microtask)
异步方法中的宏任务与微任务JS的任务事件执行机制:当执行引擎在主线程方法执行完毕,到达空闲状态时,会从任务队列中按顺序获取任务来执行(task-> task-> task…);浏览器为了能够使得 JS 内部 task(任务) 与 DOM 任务能够有序的执行,会在一个 task 执行结束后,在下一个 task 执行开始前,对页面进行重新渲染 (task-> 渲染-> tas...原创 2019-07-29 10:51:40 · 3432 阅读 · 2 评论 -
Vue插件——组件间通信bus
vue中父子间通信常用的有 ( $on 和 $emit 搭配props);兄弟间通信可以通过使用一个空的Vue实例作为中央事件总线,就是常说的bus;或者用vuex(小项目没必要使用);bus在npm上网址以下是自己看书,照例写的bus小插件:bus精华点就是,利用一个空的vue实例作为中央事件总线,这样无论是组件树的哪一层都能通信到,使用$emit, $on, $off 分别来分发、监...原创 2019-08-03 13:59:27 · 490 阅读 · 0 评论 -
Vue——数组
原文链接Vue为了增加列表渲染的功能,增加了一组观察数组的方法,而且可以显示一个数组的过滤或排序的副本。变异方法Vue 包含一组观察数组的变异方法,它们将会触发视图更新,包含以下方法:push() 接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度pop() 从数组末尾移除最后一项,减少数组的length值,然后返回移除的项shift() 移除数组中的第一个项并返回该...转载 2019-07-31 11:30:11 · 14275 阅读 · 0 评论 -
vue+axios+webpack配置跨域(axios配置)
什么是跨域?浏览器有一个叫做同源策略的东西。同源策略限制了从同一个源加载的文档或脚本如何与来自另一个源的资源进行交互。这是一个用于隔离潜在恶意文件的重要安全机制。同源策略规定了如果两个页面的协议、域名、端口中任意一个不相等,就认为两个页面具有不相同的源两个不同源的页面资源交互会受到浏览器的同源策略限制,也就出现了我们说的跨域问题。配置proxyTable解决跨域问题我们使用vue-cli...转载 2019-08-08 14:02:45 · 988 阅读 · 0 评论 -
vue+axios+webpack+node配置跨域(用node写代理服务器)
用node设置代理服务器之间是没有跨域问题的const http = require('http');const request = require('request');const hostname = '127.0.0.1';const port = 8010;const interURL = 'https://www.easy-mock.com/mock/5d4b7d772b...原创 2019-08-08 15:12:54 · 309 阅读 · 0 评论 -
Vue——父子组件间异步动态获取数据传递数据时,子组件获取不到值或者延时获取
父子组件传值时,父组件从接口获取数据,通过props传递给子组件。实际情况下:父组件获取数据有时间延迟,传递的props值为空,子组件接收的数据为props默认值父子组件生命周期父组件异步请求数据传递给子组件父子组件接收数据有延迟父子组件生命周期对比一、加载渲染过程父beforeCreate->父created->父beforeMount->子beforeCreate...原创 2019-08-14 13:52:33 · 15292 阅读 · 4 评论 -
vue+nginx设置跨域
vue项目中的配置以vue-cli搭建的项目为例, 在webpack配置文件 /config/index.js, 由于我们是在开发环境下使用,自然而然是要配置在dev里面,找到 proxyTable属性,配置如下:dev: { // Paths assetsSubDirectory: 'static', assetsPublicPath: '/', proxy...原创 2019-08-26 10:38:28 · 12350 阅读 · 0 评论 -
Koa2 + MySQL+ Sequelize搭建后台
最近学习koa2 + MySQL时看到 ‘Sequelize’关键词说是管理数据库的,就去google了一下,发现是一个好东西,打开了新的世界!!源码先上为敬Sequelize 是一款比较主流的基于Node异步ORM框架(Object-Relational-Mapping 对象关系映射),具体定义自定搜一下。大致就是在 Node 开发中,避免在代码中直接操作 SQL 语句,并且可以像操作实体...原创 2019-09-06 16:14:50 · 5024 阅读 · 2 评论 -
Vue——生命周期自己的理解
看了官网的Vue生命周期和各路大神的生命周期详解,写了一点自己的见解:原创 2019-09-09 11:42:56 · 292 阅读 · 0 评论 -
事件冒泡与事件捕获
最近面试被问到关于事件冒泡和捕获的知识,大部分都还记得,栽在了IE上面(IE只有冒泡没有捕获),回来记忆,顺便把一些和事件流有关的内容再梳理一遍。我的理解:事件冒泡顾名思义,气泡从小变大,从冒泡起点到越来越大,所以是从目标事件源扩散出去的,一直到HTML根元素,期间遇到的同类型的事件也被自动触发;(IE和常用浏览器都支持)事件捕获从根元素开始,逐渐逐渐缩小范围,直到目标事件源,期间遇到的...原创 2019-10-09 09:36:39 · 342 阅读 · 0 评论 -
小程序开发心得
radio 单选框小程序radio和checkbox样式问题选中样式:/* radio未选中时样式 */radio .wx-radio-input{border-radius: 3rpx;height: 26rpx;width: 26rpx;margin-top: -4rpx;/* 自定义样式.... */}/* 自定义样式radio选中时样式 */radio .wx...原创 2019-08-26 09:54:12 · 157 阅读 · 0 评论 -
vue——回到顶部监听滚动事件
&lt;template&gt;&lt;div class="tools"&gt;&lt;ul @mouseleave="mouseLeave()"&gt;&lt;li @click="toTop(step)"&gt;回到顶部&lt;/li&原创 2018-12-24 17:39:40 · 2208 阅读 · 0 评论 -
JS高级程序设计第四章笔记作用域&作用域链
全局执行环境就是最外面的一个执行环境,即window对象; 执行环境(作用域):简单理解就是变量或者函数能够起作用的区域,出了这个区域就不能用,这个环境内代码执行完毕后,环境被销毁,内存被回收,其中所有的变量和函数都销毁;原创 2017-07-12 21:27:07 · 250 阅读 · 0 评论 -
JS中的函数声明提升和变量声明提升
在 你不知道的JavaScript(上卷) 一书的第40页中写到:函数会首先被提升,然后才是变量。原创 2017-07-29 10:46:53 · 604 阅读 · 0 评论 -
CSS外边距合并问题
所谓外边距合并,指的是当两个垂直外边距相遇时,它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。转载 2017-07-23 09:15:45 · 523 阅读 · 0 评论 -
JavaScript DOM编程艺术第七章Ajax学习笔记
关于Ajax原理 本地file浏览不要用webkit核心浏览器,要用firefox。否则就要搭建服务器后通过http访问。今天学习了Ajax从本地文件获取文本。遇到了些问题,在网络上都找到了解决办法。原创 2017-07-08 14:04:22 · 1035 阅读 · 3 评论 -
原生JS写选项卡
封装两个方法deleteClass;addClass原创 2017-07-08 16:07:37 · 7638 阅读 · 2 评论 -
块状元素和行内元素
块状元素: *{box-sizing:border-box}给盒子设置宽度块级元素会独占一行,默认情况下,其宽度自动填满其父元素宽度(可设置宽高). ,可以用display:inline设置成行内元素;常用块状元素:原创 2017-05-21 19:48:58 · 421 阅读 · 0 评论 -
JavaScript DOM编程艺术第十章
overflow属性:visible,hidden,scroll,autovisible:不裁剪溢出的内容。浏览器将溢出的内容呈现在其容器元素的显示区域以外,全部内容都可见、hidden:隐藏溢出的内容。内容只显示在其容器元素的显示区域里,这意味着只有一部分内容可见、scroll:类似于hidden,浏览器将对溢出的内容进行隐藏,但显示一个滚动条以便让用户能够滚动看到内容的其他部分、auto原创 2017-05-18 20:02:20 · 529 阅读 · 0 评论 -
Position定位
Position定位static、fixed、relative、absolute.原创 2017-05-18 19:36:12 · 382 阅读 · 0 评论 -
JavaScript DOM编程艺术第九章学习笔记
网页的三层结构结构层:超文本标记语言(HTML)表示层:层叠样式表(CSS)行为层:JavaScript和文档对象模型(DOM)通过CSS而不是DOM去设置样式,js直接更新classname,行为层和表示层分离原创 2017-05-18 10:00:58 · 412 阅读 · 0 评论 -
初识闭包
阮一峰大神对闭包的解释 我对闭包的理解就是:一个有权访问另一个作用域中变量的函数,这个函数的活动对象包括它涉及到所有变量对象所在函数的活动对象即作用域,并且如果已经赋值,也会一并带出去,除了this是特例;注意,这里如果一个变量有多个值,只会取最后一个,见下面的for循环;原创 2017-07-17 17:36:07 · 203 阅读 · 0 评论 -
react---react组件创建,通过React.createClass方法与class App extends Component方法的区别
createClass本质上是一个工厂函数,extends的方式更加接近最新的ES6规范的class写法。两种方式在语法上的差别主要体现在方法的定义和静态属性的声明上。createClass方式的方法定义使用逗号,隔开,因为creatClass本质上是一个函数,传递给它的是一个Object;而class的方式定义方法时务必谨记不要使用逗号隔开,这是ES6 class的语法规范。转载 2017-08-25 09:14:58 · 2897 阅读 · 0 评论 -
For..in 和 For..of
在循环对象属性的时候,使用for…in;在遍历数组的时候的时候使用for…of;for…in循环出的是key,for…of循环出的是value;注意,for…of是ES6新引入的特性。修复了ES5引入的for…in的不足For in是遍历键名作用于数组的for-in循环除了遍历数组元素以外,还会遍历自定义属性;一个Array数组实际上也是一个对象,它的每个元素的索引被视为一个属性。v...原创 2018-12-12 15:20:55 · 1218 阅读 · 1 评论 -
常用JS—Array数组方法
splice方法splice() 方法用于插入、删除或替换数组的元素。array.splice(index,num,arr);返回被删除的元素/***index:修改的位置即下标数字*num:删除的长度,默认是至结尾*arr:添加进去的数组**/...原创 2018-10-08 16:36:55 · 10951 阅读 · 0 评论 -
常用JS——string字符串方法
一、关于字符串分割 1、slice(start,end); 关于这个方法,一定要搞懂四个关键点:(1)截取字符串时不包括下标为end的元素。(2)end是可选参数,没有时,默认从start到结束的所有字符串。(3)String.slice与Array.slice区别。(4)参数为负数时,是如何处理的。其中第3点其实就是在JavaScript中字符串和数组都具有这个方法,它们...转载 2018-08-21 10:47:36 · 85756 阅读 · 5 评论 -
angularJs1.x学习——指令(directive)之scope
scope 指令的作用域可选 ,默认是false false: 使用父作用域,指令中对属性的修改,会直接 作用到父级作用域中 true: 从父作用域继承 ,并创建一个新的作用域对象 ,指令 中可以访问 父级的作用域,修改不会影响 到父级 {}: 创建一个隔离作用域,不能访问 父级的作用域,修改也不会影响 到父级<!DOCTYPE html><html lang="...原创 2018-07-13 17:08:30 · 1419 阅读 · 0 评论 -
移动前端开发之viewport的深入理解
在移动设备上进行网页的重构或开发,首先得搞明白的就是移动设备上的viewport了,只有明白了viewport的概念以及弄清楚了跟viewport有关的meta标签的使用,才能更好地让我们的网页适配或响应各种不同分辨率的移动设备。一、viewport的概念通俗的讲,移动设备上的viewport就是设备的屏幕上能用来显示我们的网页的那一块区域,在具体一点,就是浏览器上(也可能是一个app中的...转载 2018-07-19 10:20:46 · 126 阅读 · 0 评论 -
GIT学习系列——常用git指令
* git常用指令* 拷贝一个远程仓库git clone 仓库地址查看当前分支状态git status查看当前分支状态git add .添加README文件git add README test.rb LICENSE提交多个文件git commit -m “修改说明” – 提交git commit -a -m ‘added new benchma...原创 2018-07-06 10:39:18 · 351 阅读 · 0 评论