- 博客(37)
- 收藏
- 关注
RSS订阅原创 VUE.JS 使用axios数据请求时数据绑定时 报错 TypeError: Cannot set property 'xxxx' of undefined 的解决办法
正常情况下在data里面都有做了定义在函数里面进行赋值这时候你运行时会发现，数据可以请求到，但是会报错 TypeError: Cannot set property ‘listgroup’ of undefined主要原因是：在 then的内部不能使用Vue的实例化的this, 因为在内部 this 没有被绑定。可以看下 Stackoverflow 的解释：解决办法：1、用ES6...
2019-11-21 14:50:37
464
原创 如何查看接口
How？Summary开发工具：Idea难度系数：★☆☆☆☆建议用时：30min前后端分离架构中，前后端交互都是靠接口对接的，后端定义好接口，online或者offline告知前端，即可同时开发，不受影响。前后端都需要快速找到接口，后端根据接口找到实现代码，这是非常基础的。1.如何找接口？我们直接访问页面，然后打开开发者工具Chrome:快捷键：Mac 系统下：Alt + Comma...
2019-11-13 17:56:50
9154
原创 页面加载的区别
通用的页面加载js有四种方式：1.window.onload = function(){}; —-js2.(window).load(function());——Jquery3.(window).load(function(){});——Jquery 3.(window).load(function());——Jquery3.(document).ready(function(){});–J...
2019-11-13 17:38:57
205
原创 button标签与input type=button标签使用的差异
button标签和input type=button标签都是html文档中用来表示按钮属性的元素，不过他们在布局和实际使用功能中存在一些差异。下面将项目中遇到的一些总结如下：1.属性和布局差异。（a）width/height属性的差异button标签的的width 和height属性是包括border在内的；Input type=button的border则是在设定的width和hei...
2019-11-01 11:58:49
480
原创 前端重构方案(知识点总结)
前言前端技术发展很快，很多项目面临前端部分重构，很开心可以让我进行这次项目前端的重构方案编写，在思考的同时参考了网上很多资料，希望本篇重构方案有一定的完整性，可以带给大家一些在面临重构时有用的东西，同时希望路过的大牛小牛不领赐教，能给我略微指点下重构相关的点，在下感激不尽~一、原项目梳理首先对原来项目做一个大概的梳理，既然是重构，当然很多东西是可以继续拿来使用的。1.1页面结构我这边负责...
2019-10-28 14:49:29
4893
原创 ajax(05)
AJAX技术即 Asynchronous Javascript And XML，AJAX 不是一门的新的语言，而是对现有持术的综合利用。本质:是在HTTP协议的基础上通过js的XMLHttpRequest对象与服务器进行通信。作用：可以在页面不刷新的情况下，请求服务器，局部更新页面的数据；异步 与 同步(了解)指某段程序执行时不会阻塞其它程序执行，其表现形式为程序的执行...
2019-10-27 19:40:18
191
原创 ajax(04)
瀑布流案例封装jQuery瀑布流插件//特点分析：//1. 跟以前将的瀑布流不一样的是，这次的瀑布流固定版心为1200px//2. 瀑布流固定摆放5列，每一列的宽度固定为232px。//思路分析：//1. 计算每一列之间的缝隙//2. 初始化一个数组，用户存储每一列的高度 [0,0,0,0,0]//3. 查找数组的最小列，每次都把图片定位到最小列的位置//4. 更新数组最小列的...
2019-10-27 19:36:54
86
原创 ajax(03)
接口化开发请求地址即所谓的接口，通常我们所说的接口化开发，其实是指一个接口对应一个功能， 并且严格约束了请求参数 和响应结果 的格式，这样前后端在开发过程中，可以减少不必要的讨论， 从而并行开发，可以极大的提升开发效率，另外一个好处，当网站进行改版后，服务端接口进行调整时，并不影响到前端的功能。获取短信验证码需求文档(产品)总需求：点击获取验证码按钮，向服务端发送请求, 调用服务器端短信接...
2019-10-27 19:35:30
105
原创 ajax(02)
数据交互浏览器端只是负责用户的交互和数据的收集以及展示，真正的数据都是存储在服务器端的。我们现在通过ajax的确可以返回一些简单的数据（一个字符串）, 但是在实际开发过程中，肯定会会设计到大量的复杂类型的数据传输，比如数组、对象等，但是每个编程语言的语法都不一样。因此我们会采用通过的数据交换格式（XML、JSON）来进行数据的交互。XML(了解即可)什么是XMLXML 指可...
2019-10-27 19:32:51
112
原创 ajax(01)
前言我们使用php动态渲染页面时，有很多比较麻烦的地方。在前端写好页面以后，需要后台进行修改，意味这后端程序员也需要懂前端的知识，其实渲染的工作应该交给前端来做。前端没有写好页面的话，后端无法开始工作，需要等待前端的页面完成之后才能开始工作，拖延项目的进度。这种渲染，属于同步渲染，先获取数据, 如果数据获取的慢了, 会严重影响整个页面渲染速度, 且数据更新需要页面刷新http 协议回...
2019-10-27 19:30:55
139
原创 css(10)
学习目标能够使用css写出三角形能够写出3种常见的鼠标样式（cursor）能够跟随课程写出品优购首页推荐模块能够跟随课程写出品优购首页focus焦点图模块能够跟随课程写出品优购首页service服务模块能够跟随课程写出品优购首页楼层模块能够跟随课程写出品优购首页footer焦点图模块。。。。。。使用css写出一个三角形有时候需要在页面中展示一个三角形，并且要求只使用css...
2019-10-27 14:58:24
119
原创 css(9)
学习目标能够使用ps进行基本的切图能够完成项目基本目录搭建能够完成品优购头部能够完成品优购导航能够设置盒子的边框圆角。。。。。。边框圆角可以使用边框圆角画一个圆（画一个小圆点）border:边框 radius：半径border-radius: 5px; 四个都设, 一样大border-radius: 5px 15px 25px 35px; 左上、右上、右下、左...
2019-10-27 14:56:58
224
原创 css(8)
学习目标能够理解什么是精灵图及优点（将很多小图片放到一张图片上，减少对服务器请求次数，减轻服务器压力）能够使用精灵图设置背景图片能够使用字体图标能够完成滑动门案例能够写出常用的样式初始化能够了解BFC以及触发BFC的几种方式。。。。。。双伪元素清除浮动伪元素清除浮动升级版（既解决了清除浮动、又解决了塌陷 ）两个伪元素清除法的合并方法如下：ヾ(๑╹◡╹)ﾉ"双伪元素清除...
2019-10-27 14:53:11
177
原创 css(7)
学习目标理解定位的使用场景（盒子之间的层叠）能够说出相对定位的特点（相对于自己原来的位置定位移动）能够说出绝对定位的特点（相对于非静态定位的父元素定位移动）能够说出固定定位的特点（相对于浏览器进行定位移动）能够理解子绝父相（子盒子绝对定位，父盒子相对定位，布局中会经常使用到）能够实现z-index控制元素的层级（数值越大，层级越高）能够说出vertical-align属性的使用（设...
2019-10-27 14:21:35
231
原创 css(6)
学习目标能够完成尚合项目的头部部分能够完成尚合的导航部分能够完成尚合的产品详情部分能够完成尚合的底部部分理解上课的知识点…浮动元素的有行内块的显示效果浮动元素的特点之一为：浮动之后的元素有类似行内块的显示效果所以浮动元素不管前生是什么，浮动之后就变成了一个类似行内块的效果！不再有块级的特点：以div为例：块级元素特点1：水平居中使用margin:0 auto;前生...
2019-10-27 14:19:47
141
原创 css(5)
学习目标了解margin合并与塌陷现象（相邻块元素垂直外边距的合并，嵌套块元素垂直外边距的塌陷）能够说出解决margin塌陷的几种方式给父盒子加一个边框给父盒子加 padding-top给父盒子设置属性 overflow: hidden => BFC;给父盒子设置浮动给父盒子设置为行内块理解浮动的作用及特点（解决上下盒子 可以水平布局的问题，脱标）能够说出几种清除浮动...
2019-10-27 14:18:33
171
原创 css(4)
学习目标能够说出盒子模型的组成（content、padding、border、margin）能够使用border的相关属性（width、color、style）能够使用border-collapse实现边框合并能够计算盒子的实际大小（content+padding+border）能够说出*{margin:0;padding:0;}的作用。。。。。。盒子模型（思维模式）一种思维...
2019-10-27 14:05:31
140
原创 css(3)
学习目标能够说出background相关的几个属性（color、image、repeat、position）能够使用background设置颜色和图片（color、image）能够使用background-position设置背景图片的位置（left、center、right）能够说出元素的三种显示方式（块级元素、行内元素、行内块元素）能够使用display转换元素的显示方式（disp...
2019-10-27 14:00:06
93
原创 css(2)
学习目标能够说出三种CSS的书写位置（内嵌、行内、外联）能够使用text开头的几个属性（text-align，text-indent、text-decoration）能够使用margin：0 auto（容器（盒子）居中）能够说出CSS三大特性（继承性、层叠性、优先级）能够说出CSS能够继承的属性（color、text-、font- 等）能够计算CSS选择器的权重（0,0,0,0）。...
2019-10-27 13:54:38
167
原创 css(1)
学习目标了解CSS的作用（给页面添加样式）能够使用font属性设置文字相关样式（swsf）能够使用chrome调试HTML/CSS代码能够使用ID/类/标签选择器的作用（选择页面的标签，给其添加样式）能够使用交集、并集选择器能够使用后代/子代选择器的作用（选择页面的标签，给其添加样式）几种设置颜色的方式（英文单词、rgb(0,0,0)、rgba(0,0,0,0)、#FEFEFE）...
2019-10-27 13:50:46
200
原创 html(3)
学习目标能够写出4~5个常用的表单元素（input（多种形态）、select、textarea、form、label）能够说出表单name属性和value属性的作用（向后端传递数据。name（这是什么数据）=value（具体数据是什么））能够掌握表单元素checked和selected的使用（checked：单选和多选默认选中；selected：下拉菜单默认选中）div和span的使用（...
2019-10-27 13:45:10
176
原创 html(2)
链接标签（重点）a 标签 (Anchor ) : 超链接（锚）超链接在页面中起到跳转或定位的作用（超链接、锚链接、a链接、a标签）a标签的跳转功能作用: 可以从一个页面跳转到另一个页面代码: <a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>效果：链接未点击的时候，默认显示蓝色链接点击过以后，显示为紫色（因为浏览...
2019-10-27 12:52:16
222
原创 html(1)
1. 五大浏览器：IE（Edge）浏览器Firefox（火狐）浏览器Chrome（谷歌）浏览器Safari浏览器Opera（欧朋）浏览器1.1 五大浏览器的内核:IE浏览器（Trident）Firefox（火狐）浏览器（Gecko）Chrome（谷歌）浏览器（webkit）Satari浏览器（blink）Opera（欧朋）浏览器（blink 早期：presto ）浏览器内核...
2019-10-27 10:22:39
229
原创 安装vue-cli完以后执行npm run dev 不会自动打开网页
安装完vue-cli以后执行npm run dev后出现这个：我们只需要在config/index.js里面把autoOpenBrowser:false；改为true就行了！
2019-10-23 17:06:43
444
原创 Git 常用命令总结
1. 概览工作区 Workspace暂存区 Stage / Index本地仓库 Repository远程仓库 Remote2. 修改2.1 暂存修改操作一览 操作 bash 创建stash git sta...
2019-10-16 14:35:39
84
原创 display:inline-block元素之间空隙的产生原因和解决办法
在CSS布局中，如果我们想要将一些元素在同一行显示，其中的一种方法就是把要同行显示的元素设置display属性为inline-block。但是你会发现这些同行显示的inline-block元素之间会出现一定的空隙。效果图:代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UT...
2019-10-14 09:50:15
158
原创 HTML块元素与内联元素嵌套规则
块状元素：一般是其他元素的容器，可容纳内联元素和其他块状元素，块状元素排斥其他元素与其位于同一行，宽度（width）高度（height）起作用。常见块状元素为div和p内联元素：内联元素只能容纳文本或者其他内联元素，它允许其他内联元素与其位于同一行，但宽度（width）高度（height）不起作用。常见内联元素为a.块状元素与内联元素嵌套规则：(1).块元素可以包含内联元素或某些块元素，...
2019-10-13 11:23:03
250
原创 css设置水平垂直居中的四种方法
如果想要元素左右对其的方法可以使用 float、flex、position块级元素左右居中 margin 0 auto；内联元素 父级元素 text-align center而垂直水平居中呢？1.positionhtml部分<div class="center">test</div>元素已知宽和高, css部分 .center { backgr...
2019-10-12 09:14:19
219
转载 css3新发现height:100vh;
vh/vwvh: 相对于视窗的高度, 视窗被均分为100单位的vh;vw: 相对于视窗的宽度, 视窗被均分为100单位的vw;vmax: 相对于视窗的宽度或高度中较大的那个。其中最大的那个被均分为100单位的vmax;vmin: 相对于视窗的宽度或高度中较小的那个。其中最小的那个被均分为100单位的vmin;视区所指为浏览器内部的可视区域大小，即window.innerWidth/wi...
2019-10-12 09:02:17
979
原创 JavaScript中浅拷贝和深拷贝的区别和实现
JavaScript有两种数据类型，基础数据类型和引用数据类型。基础数据类型都是按值访问的，我们可以直接操作保存在变量中的实际的值。而引用类型如Array，我们不能直接操作对象的堆内存空间。引用类型的值都是按引用访问的，即保存在变量对象中的一个地址，该地址与堆内存的实际值相关联。一、深拷贝和浅拷贝的区别浅拷贝（shallow copy）：只复制指向某个对象的指针，而不复制对象本身，新旧对象共享...
2019-10-11 14:46:50
111
原创 细谈 axios和ajax区别
1.区别axios是通过promise实现对ajax技术的一种封装，就像jQuery实现ajax封装一样。简单来说： ajax技术实现了网页的局部数据刷新，axios实现了对ajax的封装。axios是ajax ajax不止axios。下面列出代码来对比一下：axios：axios({ url: '/getUsers', method: ...
2019-10-11 14:38:24
1950
2
转载 前端面试题
1.请你谈谈Cookie的弊端1.IE6或更低版本最多20个cookie2.IE7和之后的版本最后可以有50个cookie。3.Firefox最多50个cookie4.chrome和Safari没有做硬性限制Opera 会清理近期最少使用的Firefox会随机清理 4096字节，为了兼容性，一般不能超过 IE 提供了一种存储可以持久化用户数据，叫做IE5.0就开始支持。每个数据最多12...
2019-10-11 13:34:48
284
转载 闭包原理
JS之闭包原理我们先看一个闭包的例子：function foo() { let a = 2; function bar() { console.log( a ); } return bar;}let baz = foo();baz();大家肯定都写过类似的代码，相信很多小伙伴也知道这段代码应用了闭包，but, Why do...
2019-10-11 12:33:29
129
转载 vue面试
Vue面试中，经常会被问到的面试题/Vue知识点整理一、对于MVVM的理解？MVVM 是 Model-View-ViewModel 的缩写。Model代表数据模型，也可以在Model中定义数据修改和操作的业务逻辑。View 代表UI 组件，它负责将数据模型转化成UI 展现出来。ViewModel 监听模型数据的改变和控制视图行为、处理用户交互，简单理解就是一个同步View 和 Model...
2019-10-11 12:12:51
110
转载 JavaScript和jQuery常见面试题
javascript和jQuery在前端开发中发挥着巨大的作用，在面试的过程中这也是不可缺少的话题吧！故搜集了一些面试会遇到的问题，与大家共享！JavaScript部分1.下面代码什么会被打印在控制台上？(function(){ var a = b = 5;})();console.log(b);上面的代码会打印出5，拆解函数变量赋值过程如下：b = 5;var a =b;...
2019-10-11 10:38:33
643
原创 最常见的20道jQuery经典面试题
1. jQuery 库中的 $() 是什么？（答案）()函数是jQuery()函数的别称，乍一看这很怪异，还使jQuery代码晦涩难懂。一旦你适应了，你会爱上它的简洁。() 函数是 jQuery() 函数的别称，乍一看这很怪异，还使 jQuery 代码晦涩难懂。一旦你适应了，你会爱上它的简洁。()函数是jQuery()函数的别称，乍一看这很怪异，还使jQuery代码晦涩难懂。一旦你适应了，你会爱...
2019-10-11 10:09:22
1179
转载 JS 中对变量类型的判断
JS 中对变量类型的判断总结：1. 一般简单的使用 typeof 或 instanceof 检测（这两种检测的不完全准确）2. 完全准确的使用 原生js中的 Object.prototype.toString.call 或 jquery中的 $.type 检测在 JS 中，有 5 种基本数据类型和 1 种复杂数据类型，基本数据类型有：Undefined, Null, Boolean, Nu...
2019-10-11 09:51:19
158
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人