![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
文章平均质量分 94
爱问的艾文
这个作者很懒,什么都没留下…
展开
-
前端状态管理:Vuex、Flux、Redux、MobX概念篇
Vuex Flux Redux MobX 的对比原创 2023-02-15 19:01:01 · 1599 阅读 · 1 评论 -
Vue的生命周期详解
文章目录储备知识什么是钩子函数?生命周期钩子函数概念Vue生命周期钩子函数作用Vue生命周期流程图Vue 生命周期钩子函数解析1. beforeCreate2. created3. beforeMount4. mounted5. beforeUpdate6. beforeDestroy7. destroyed储备知识什么是钩子函数?钩子函数就是个函数,它的函数名称是确定的,它是在系统消息触发是被系统调用,不是用户自己触发的,也就是说它是系统消息触发自动会被调用。生命周期钩子函数概念生命周期钩子函原创 2020-09-15 17:07:14 · 197 阅读 · 0 评论 -
Vue 学习笔记 6 Mint UI 和 MUI
1.Mint UIMint UI是基于 Vue.js的移动端组件库1、安装:npm install mint-ui -S2、引入方式2.1 引入方式1 引入全部组件:但是不建议使用这种方式,因为会占用bundle.js的空间import Vue from 'vue';import Mint from 'mint-ui';import 'mint-ui/lib/style.css';//为了更好看一下还可以使用mint-ui中的样式库import App from './App.vue'原创 2020-07-04 15:47:54 · 355 阅读 · 0 评论 -
Vue 学习笔记 5 -webpack
文章目录1.背景1.1 node.js 和 npm1.2 nrm1.3 网页中常见的静态资源2.webpack2.1 webpack的安装2.1.1 全局方式安装2.1.2 单个项目安装2.2 webpack.config.js2.3 package.json2.4 webpack命令3.webpack-dev-server自动打包工具package.json 中的命令4.html-webpack-plugin 插件 在内存中生成HTML页面5.页面中的 css样式表5.1 使用加载器来打包处理css文件5原创 2020-07-04 15:47:07 · 1023 阅读 · 0 评论 -
Vue 学习笔记第 4 篇
文章目录背景介绍1.父子组件之间传值1.1父组件向子组件传值在使用组件标签时,通过属性绑定的方式,将父组件的值传入到子组件1.2.父组件向子组件传递方法使用事件绑定机制1.3 子组件向父组件传值2.ref快速获取元素3.路由3.1 概念后端路由前端路由3.2 vue-router安装的方式3.2.1 直接下载/cdn - - 在网页里直接开发的方式3.2.2 NPM - - webpack构建工具进行开发的方式3.3 vue-router 使用3.3.1 router-view方式3.3.2 rou原创 2020-07-04 15:45:24 · 110 阅读 · 0 评论 -
Vue 学习笔记第 3 篇
文章目录1.vue动画1.1 transition1.2 动画钩子函数-实现半场动画(入场动画)1.3 列表动画2.Vue 创建组件的方式2.1 Vue.extend2.2 Vue.component2.3 使用template标签的id2.4 使用vue实例的components创建私有组件3.组件中的data和methods4.组件之间的切换方式4.1 v-if 和 v-else 实现两个组件之间的切换4.2 component 标签5.组件切换动画1.vue动画1.1 transition使用原创 2020-07-04 15:44:33 · 156 阅读 · 0 评论 -
Vue 学习笔记第2篇
文章目录1.列表的增删例子2.过滤器-列表例子完善2.1过滤器定义2.2实现时间格式化:2.3自定义局部过滤器2.4字符串填充 ES63.按键码 按键修饰符4.自定义指令4.1钩子函数:4.1.1指定定义函数提供了几个钩子函数(可选):4.1.2钩子函数的参数4.2 私有的自定义指令4.3 函数简写5.Vue实例的生命周期5.1 创建期间的生命周期函数:5.1.1 beforeCreate()5.1.2 created()5.1.3 beforeMount()5.1.4 mounted()5.2 运行期间的原创 2020-07-04 15:43:33 · 169 阅读 · 1 评论 -
Vue学习笔记1-初识
背景介绍Vue.js是目前最火的一个前端框架React是目前最流行的一个前端框架,除了可以开发网站,还可以用来开发APPVue.js介绍Vue.js是一套构建用户界面的框架,只关注视图层特点:易上手便于与第三方库或既有项目整合(Vue有配套的第三方库,可以整合起来做大型项目的开发)为什么要学习流行框架企业:使用这些框架,对于企业来说可以提高开发效率,提升开发效率的发展历程: 原生的JavaScript由于兼容性问题比较麻烦于是就产生了一些库 - > jQuery 之类的类库原创 2020-07-04 15:40:08 · 199 阅读 · 0 评论 -
跟着艾文一起学前端-第23篇 - Vue -动画、组件、路由
文章目录1.vue动画1.1 transition1.2 动画钩子函数-实现半场动画(入场动画)1.3 列表动画2.Vue 创建组件的方式2.1 Vue.extend2.2 Vue.component2.3 使用template标签的id2.4 使用vue实例的components创建私有组件3.组件中的data和methods4.组件之间的切换方式4.1 v-if 和 v-else 实现两个组件之间的切换4.2 component 标签5.组件切换动画背景介绍1.父子组件之间传值1.1父组件向子组件传值原创 2020-06-10 14:27:43 · 220 阅读 · 0 评论 -
跟着艾文一起学前端-第22篇 - Vue -介绍
背景介绍Vue.js是目前最火的一个前端框架React是目前最流行的一个前端框架,除了可以开发网站,还可以用来开发APPVue.js介绍Vue.js是一套构建用户界面的框架,只关注视图层特点:易上手便于与第三方库或既有项目整合(Vue有配套的第三方库,可以整合起来做大型项目的开发)为什么要学习流行框架企业:使用这些框架,对于企业来说可以提高开发效率,提升开发效率的发展历程: 原生的JavaScript由于兼容性问题比较麻烦于是就产生了一些库 - > jQuery 之类的类库原创 2020-06-10 14:24:04 · 363 阅读 · 0 评论 -
跟着艾文一起学前端-第21篇-JavaScript之AJAX
ajax [ˈeɪˌdʒæks]原创 2020-05-07 20:31:28 · 169 阅读 · 0 评论 -
跟着艾文一起学前端-第20篇-JavaScript库之jQuery
文章目录jQuery中的顶级对象jQuery和DOM对象的相互转换jQuery中的书写方法jQuery中的顶级对象jQuery中的顶级对象就是jQuery或者是$jQuery和DOM对象的相互转换背景:jQuery中有些兼容性的问题没有解决就需要使用DOM的操作去解决,等解决完了还要再转回jQuery对象,这就需要jQuery转成DOM,和DOM转成jQuery。将DOM对象转换成j...原创 2020-04-27 20:22:39 · 126 阅读 · 0 评论 -
跟着艾文一起学前端-第19篇-JavaScript-其他知识点
this关键字的指向在普通函数 中的this:普通模式下是浏览器的顶级对象window, 严格模式时是undefined在定时器方法中:window.setInterval(function(){},time); 是浏览器的顶级对象window在对象.方法 中:当前实例对象即调用该方法的对象在构造函数中:当前实例对象在原型对象方法中:当前实例对象事件绑定方法中: 绑定事件对象_...原创 2020-04-24 15:54:11 · 134 阅读 · 0 评论 -
跟着艾文一起学前端-第18篇-JavaScript-原型与继承
1、背景函数的相关知识构造函数和实例对象的关系实例对象由构造函数创建,使用构造函数创建实例对象的过程叫做对象的实例化。查看某个对象的结构,可以通过console.dir(对象);通过查看对象的结构,可以看到每个对象都有一个特殊的属性叫作原型(prototype)判断一个对象的类型的方式:instanceof - - datObj instanceof CustomObject...原创 2020-04-23 20:50:20 · 149 阅读 · 0 评论 -
跟着艾文一起学前端-第17篇-JavaScript - BOM
BOMBrowser Object Model 浏览器对象模型,用于操作浏览器背景页面中的顶级对象是document,浏览器中的顶级对象是window页面中所有的内容都属于浏览器的,页面中的内容也都是属于windowwindow的一些事件触发时期:1. window.onload - - 页面加载完毕时触发;2. window.onbeforeunload - - 页面关闭之前触发...原创 2020-04-18 19:38:50 · 152 阅读 · 0 评论 -
跟着艾文一起学前端-第16篇-JavaScript - DOM中的事件
绑定事件事件的绑定方式具体见跟着艾文一起学前端-第15篇-JavaScript - DOMaddEventListener 和 attachEvent 两种绑定事件的区别:绑定事件类型支持浏览钱this对象参数addEventListenerChrome 、FireFox、IE11绑定事件的对象(eventType,function,false)三个参数,且事件...原创 2020-04-17 17:09:02 · 127 阅读 · 0 评论 -
跟着艾文一起学前端-第15篇-JavaScript - DOM
DOMDocument Object Model 文档对象模型 - - 作用是操作HTML页面中的元素概念1. 元素HTML页面中有很多个标签,每个标签都是一个元素(element),每个元素都是一个对象,标签是可以嵌套的,所以元素可以包含元素;2. 节点HTML文档中所有的内容都叫节点:文本、标签、标签的属性3.DOM树我们可以把HTML文档当做根,由HTML文档及文...原创 2020-04-15 20:33:02 · 172 阅读 · 0 评论 -
跟着艾文一起学前端-第14篇-JavaScript - 函数和对象
js中的函数js中的函数的一些特点:通过函数内部的 arguments 对象可以获取到传入该函数的所有参数的值js中的匿名函数: 如果定义一个变量赋值为一个函数表达式,这个变量就相当于是一个函数,可以直接对该变量加一个小括号此时就像是调用函数一样;由上面的匿名函数的方式可以引出函数的自调用,(function () {匿名函数体})();通过typeof 可以获取函数的数据类型,结果返...原创 2020-04-13 18:41:01 · 145 阅读 · 0 评论 -
跟着艾文一起学前端-第13篇-JavaScript初识
简介JavaScript(简称“JS”) 是一种具有函数优先的轻量级,解释型或即时编译型的编程语言。虽然它是作为开发Web页面的脚本语言而出名的,但是它也被用到了很多非浏览器环境中,JavaScript 基于原型编程、多范式的动态脚本语言,并且支持面向对象、命令式和声明式(如函数式编程)风格。 [1]JavaScript在1995年由Netscape公司的Brendan Eich,在网景导航...原创 2020-04-10 21:01:32 · 734 阅读 · 0 评论 -
跟着艾文一起学前端-第12篇-CSS剩余零散知识点
1. 控制元素的显示与隐藏display-显示display除了可以做模式转换外(block,inline, inline-block),还可以控制显示,比如当display:none;时,该元素则不显示,就被隐藏起来了,并且不占原来的位置。块元素默认的值是block,行内元素默认的是inline,因此,对隐藏的元素进行展示时:控制块元素展示可以通过display:block; 让行内元素展...原创 2020-04-08 20:52:56 · 157 阅读 · 0 评论 -
跟着艾文一起学前端-第11篇-CSS中的定位
定位的由来有些通过浮动不好实现的布局,定位的出现,可以实现更加灵活的布局,以及与js交互。元素的定位属性主要由边偏移和定位模式两部分组成1.边偏移边偏移属性:top – 定义元素相对于其父元素上边线的距离bottom – 定义元素相对于其父元素下边线的距离left – 相对于父元素左边线的距离right – 相对于父元素右边线的距离值都是像素值,例如: top: 20px; ...原创 2020-04-07 20:27:23 · 205 阅读 · 0 评论 -
跟着艾文一起学前端-第9篇-CSS-选择器的权重
之前我们讲到同一类型的选择器,属性冲突时,冲突的属性以最后一次在代码中出现的位置为准,不同类别的选择器呢?本篇就是对不同类别的选择器的显示优先级来展开讲解选择器的权重(优先级)通配符"*"选择器 < 标签选择器< 类选择器 < id 选择器 < 行内样式 < 属性值后面加上 "!important"更专业的说法也把优先级叫做权重,权重就是优先级的意思对应的,我...原创 2020-03-28 15:57:01 · 190 阅读 · 0 评论 -
跟着艾文一起学前端-第8篇-HTML标签的显示模式
标签的另一种分类方式-按照显示模式划分HTML标签一般分为块标签和行内标签两种类型,也被称为块元素和行内元素块元素 block每个块元素通常都会独自占据一整行或者多行,可以对其设置宽、高、对齐方式等属性,常用于页面的布局结构搭建。最典型的块元素是div,也是最常用的,块中之王。其次还有<h1>到<h6>、<p> 、<ul>、<ol>...原创 2020-03-28 12:08:39 · 220 阅读 · 0 评论 -
跟着艾文一起学前端-第7篇-CSS-字体样式
CSS中的字体样式属性属性名称属性值描述font-size像素值单位px,一定记得带上单位px像素font-family字体的名称,可以是中文、英文或者Unicode编码值设置字体font-weightnormal、bold、bolder、lighter、100~900(取100的倍数切注意是没有单位的)用于定义字体的粗细,通常使用数字值。400等价...原创 2020-03-26 09:13:09 · 153 阅读 · 0 评论 -
跟着艾文一起学前端-第6篇-CSS初识
CSSCSS(Cascading Style Sheets) 层叠样式表,主要是用于设置HTML页面的内容展示的样式.比如说字体/颜色/背景等,而且还可以针对不同的浏览器设置不同的样式.CSS的三种写法:1.行内样式表(内联样式) --使用频率低位于标签内通过 style属性引入样式,具体代码如下<h1 style="color: red;">hello</h1>...原创 2020-03-25 15:07:45 · 186 阅读 · 0 评论 -
跟着艾文一起学前端-第5篇-HTML的常用标签(3)- 表单
表单介绍表单主要是用于搜集一系列的用户输入信息,我们可以简单地理解为,就像你在填写一张信息采集表一样,HTML中的表单的作用就是这样一个功能,用于搜集不同类型的用户输入,收集用户录入的信息。表单标签 -<from>及表单域被<form>标签包裹起来就是一个表单 ,它是一个包含表单元素的区域常用属性:action 表单信息提交地址method 提交方式 —...原创 2020-03-21 18:28:18 · 201 阅读 · 0 评论 -
跟着艾文一起学前端-第4篇-HTML的常用标签(2)-数据集标签
数据集标签1. 列表1.1 无序列表<ul><ul> <li> apple </li> <li> pen</li> <li> apple pen</li></ul>效果如下: apple pen apple pen<ul> 是unordere...原创 2020-03-20 23:37:52 · 165 阅读 · 0 评论 -
跟着艾文一起学前端-第3篇-HTML的常用标签(1)
业精于勤荒于嬉,行成于思毁于随原创 2020-03-14 18:00:41 · 1003 阅读 · 0 评论 -
跟着艾文一起学前端-第2篇-HTML-初次相识
无论此时此刻你正面临着多大的困难,都不要轻言放弃,勇敢地去战胜它,跨过难、越过坎。原创 2020-03-14 00:46:55 · 170 阅读 · 0 评论 -
跟着艾文一起学前端-第1篇-揭开神秘面纱
一个合格的程序员每年至少要学习一门新的语言。抛开学习来说,想想我的人生到现在,我一直未曾合格过。所以决定今年的学习目标是HTML+CSS+JAVASCRIPT,虽然大学一年级第二学期时学习过HTML+CSS 这门课程,但那已是8年前了,遗忘的一干二净。现在从头开始,我就当自己是一个前端小白(其实还不如小白)。为了更好的验证学习,以写博客的方式来总结收获,一方面可以鞭策自己,二来也是为了方便随时回过头来翻阅。...原创 2020-03-12 17:54:06 · 407 阅读 · 0 评论 -
HTML中字符实体
注意:实体名称对大小写敏感显示结果描述实体名称实体编号 空格  <小于号<<>大于号>>&和号&&"双引号的一个引号""'...原创 2020-03-04 18:23:51 · 122 阅读 · 0 评论