- 博客(10)
- 收藏
- 关注
原创 前端浮动、定位、过渡、动画学习总结
一、浮动(Float)1.什么是浮动?float属性用于创建浮动框,将其移到一边,直到左边缘或右边缘及包含块或另一个浮动框的边缘。语法:选择器 { float : 属性值; }属性值描述none元素不浮动【默认值】left元素向左浮动right元素向右浮动inherit元素继承父级的浮动属性值举例:<div class="none">默认不浮动</div><div class="left">左浮动<
2022-04-27 17:41:11
366
原创 Vue学习——生命周期钩子、路由
Vue学习——生命周期钩子、路由一、生命周期钩子函数所有生命周期钩子的 this 上下文将自动绑定至实例中,因此你可以访问 data、computed 和 methods。这意味着你不应该使用箭头函数来定义一个生命周期方法 (例如 created: () => this.fetchTodos())。因为箭头函数绑定了父级上下文,所以 this 不会指向预期的组件实例,并且this.fetchTodos 将会是 undefined。生命周期图#beforeCreate类型:Functio
2021-10-21 21:02:31
839
原创 router-link 属性
router-link 属性补充1.to进行页面跳转,更改路径2.tag : 指定<router-link>之后渲染成什么组件,比如将其渲染成<li>3.replace : replace不会留下history记录,所以指定replace的情况下,后退键返回不能返回到上一个页面4.active-class : <router-link>对应的路由匹配成功时,会自动给当前元素设置一个router-link-active的class,设置active-class可以
2021-10-20 23:04:00
320
原创 前端模块化开发
前端模块化一、使用模块作为出口1.步骤:在匿名函数内部,定义一个对象,给对象添加各种需要暴露到外面的属性的方法(不需要暴露的直接定义即可),最后将这个对象返回,并且在外面使用一个ModuleA接收。2.在main.js中如何使用?只需要使用属于自己模块的属性和方法。3.常见的模块化规范CommonJS、AMD、CMD、ES6的Modules二、CommonJS模块化的两个核心:导出和导入CommonJS的导出:module.exports = { flag: true,
2021-10-13 09:45:46
117
原创 Grunt/Gulp
Grunt/Gulp1、核心grunt/gulp的核心是Task,我们可以配置一系列的task,并且定义task要处理的事务(例如ES6、ts转化、图片压缩、scss转成css),之后让grunt/gulp来依次执行这些task,而且让整个流程自动化。所以grunt/gulp也被称作“前端自动化任务管理工具”。例子 :使用task将src下面的所有的js文件转成ES5的语法,并且最终输出到dist文件夹中。<script> const gulp = require('gulp
2021-10-11 10:37:24
137
原创 Vue学习——计算属性、监听属性、动画
Vue学习——计算属性、监听属性、动画一、计算属性1.引入当模板不再是简要的声明式逻辑时,而是需要对其进行一些操作时会显得难以处理。因此,对于任何复杂逻辑,应当使用 “计算属性”。例子:<div id="app"> <h2>{{firstName + ' ' + lastName}}</h2> <h2>{{firstName}} {{lastName}}</h2>//两者等价 <h2>{{getFullName()
2021-10-10 17:08:46
234
原创 组件初始化、父子组件传值、插槽
Vue学习二——组件初始化、父子组件传值、插槽一、组件化初始化1.什么是组件以及组件化?如果我们将一个页面中所有的处理逻辑全部放到一起。处理起来就会变得非常复杂,而且不利于后续的管理以及扩展。为此,引出组件化的思想:将一个完整的页面分成很多组件每一个组件都用于实现页面的一个功能块而每一个组件又可以进行细分组件化提供了一种抽象,让我们可以开发一个个独立可复用的小组件来构造我们的应用。任何的应用都会被抽象成一棵组件树。2.注册组件的基本步骤1.创建组件构造器2.注册组件3.使用组
2021-09-20 11:49:20
498
原创 交互中的跨域——cookie,session
交互中的跨域——cookie,session一、跨域1.1为什么会出现跨域问题?出于浏览器的同源策略限制。同源策略(Sameoriginpolicy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。同源策略会阻止一个域的javascript脚本和另外一个域的内容进行交互。所谓同源(即指在同一个域)就是两个页面具有相同的协议(protocol),主机(host)和端口号(po
2021-07-27 16:42:36
487
原创 Float and Position(浮动与定位)
Float and Position(浮动与定位)一、FLoat (浮动)1.1 什么是浮动?float属性用于创建浮动框,将其移到一边,直到左边缘或右边缘及包含块或另一个浮动框的边缘。语法:属性值描述none元素不浮动left元素向左浮动right元素向右浮动样例:<style>.left { float: left; width: 200px; height: 100px;
2021-05-06 21:28:44
516
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人