自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(23)
  • 收藏
  • 关注

原创 Git的介绍

一、Git是什么?Git是目前世界上最先进的分布式版本控制系统常见的版本控制工具有:CVS、SVN、Git、···SVN与Git的最主要区别SVN是集中式版本控制系统,版本库是集中放在中央服务器的,而干活的时候,用的都是自己的电脑,所以首先要从中央服务器哪里得到最新的版本,然后干活,干完后,需要把自己做完的活推送到中央服务器。集中式版本控制系统是必须联网才能工作,如果在局域网还可以,带宽够大,速度够快,如果在互联网下,如果网速慢的话,就纳闷了。 Git是分布式版本控制系统,那么它就没有中央服

2021-11-04 11:28:35 180

原创 @media

@media定义和使用使用 @media 查询,你可以针对不同的媒体类型定义不同的样式。@media 可以针对不同的屏幕尺寸设置不同的样式,特别是如果你需要设置设计响应式的页面,@media 是非常有用的。当你重置浏览器大小的过程中,页面也会根据浏览器的宽度和高度重新渲染页面。css中引入@media screen and (max-width: 600px) { /*当屏幕尺寸小于600px时,应用下面的CSS样式*/ .class { background: #ccc; }

2021-10-25 09:32:50 257

原创 移动端的理解(2)

一.屏幕尺寸平时我们通常提到手机的尺寸,比如iPhone6是4.7英寸的。手机的屏幕是以英寸为单位的。我们平时使用最多的单位是:毫米、厘米、米。1英寸(inch)=2.54厘米(cm)。英寸到底表示 的是什么呢?是手机的宽还高?原来英寸代表的意思是:手机屏幕对角线的长度。常见的屏幕尺寸有:2.4、2.8、3.5、3.7、4.2、5.5、5.6等二.屏幕分辨率指在横纵向上的像素点数,单位是px。1px=1个像素点数(注:这里的像素指的是物理设备的1个像素)。一般以纵向像素 * 横向像素 表示一

2021-10-24 20:55:19 1903

原创 移动端的了解(1)

目标:能够知道移动web的开发现状能够写出标准的viewport 视口能够使用移动web的调试方法能够说出移动端常见的布局方案能够描述流式布局能够独立完成移动端页面移动端的基本了解浏览器状态:pc端常见的浏览器:360,谷歌,火狐,qq,百度,搜狗,IE移动端常见的浏览器:uc,qq,欧朋,百度手机,360安全,谷歌,搜狗手机,猎豹总结: 兼容移动端主流浏览器,处理Webkit内核浏览器即可.手机屏幕状态移动端设备屏幕尺寸非常多,碎片化严重。Android Q设备有多种分辨率

2021-10-21 09:24:17 162

原创 谈谈对sass的了解

SassSass 是一个 CSS 预处理器。Sass 是 CSS 扩展语言,可以帮助我们减少 CSS 重复的代码,节省开发时间。Sass 完全兼容所有版本的 CSS。Sass 扩展了 CSS3,增加了规则、变量、混入、选择器、继承、内置函数等等特性。Sass 生成良好格式化的 CSS 代码,易于组织和维护。Sass 文件后缀为 .scss。为什么使用Sass?CSS 本身语法不够强大,导致重复编写一些代码,无法实现复用,而且在代码也不方便维护。Sass 引入合理的样式复用机制,增加了规则、

2021-10-18 15:39:09 186

原创 css层叠样式表

css的书写方式行内式:将CSS代码书写在HTML标签的style属性中。style是一个通用属性,每一个标签里面都拥有这个属性,规则: <标签名 style=”属性:值;属性:值;”></标签名>嵌入式:将CSS代码嵌入到HTML文件中,嵌入式是通过HTML中的<style>标签将CSS代码嵌入到HTML网页中,规则: <style type=”text/css”>

2021-10-18 10:28:05 78

原创 css、sass和scss的区别

CSS 层叠样式表行内式:将CSS代码书写在HTML标签的style属性中。style是一个通用属性,每一个标签里面都拥有这个属性,规则:<标签名 style=”属性:值;属性:值;”></标签名>嵌入式:将CSS代码嵌入到HTML文件中,嵌入式是通过HTML中的外链式:写以.css扩展名的文件,然后在标签中使用标签,将css文件链接到html文件中,规则:<标签名 style=”属性:值;属性:值;”></标签名>css预处理器css预处理

2021-10-18 10:17:26 561

原创 美食杰-编辑个人资料

图片edit.vue代码块<template> <div class="edit"> <div class="edit-item"> <span class="label">修改头像</span> <upload-img imgMaxWidth="210" actions="/api/upload?type=user" :imageUrl="avatar

2021-10-18 08:26:44 117

原创 Flex布局

Flex布局Flex是Flexible Box的缩写,意为”弹性布局”,用来为盒状模型提供最大的灵活性。任何一个容器都可以指定为Flex布局。优点:flex布局也叫弹性布局,可以简便、完整、响应式地实现各种页面布局概念:采用Flex布局的元素,称为Flex容器(flex container),简称”容器”。它的所有子元素自动成为容器成员,称为Flex项目(flex item),简称”项目”。用法:注意:设为Flex布局以后,子元素的float、clear和vertical-align(垂直对

2021-10-14 16:17:54 80

原创 ES6的知识点

ES61. ECMAScript和JavaScript的关系该标准从一开始就是针对JavaScript语言制定的,但之所以不叫JavaScript,有两个原因。一是商标,Java是Sun公司的商标,根据授权协议,只有Netscape公司可以合法地使用JavaScript这个名字,且JavaScript本身也已经被Netscape公司注册为商标。二是想体现这门语言的制定者是ECMA,不是Netscape,这样有利于保证这门语言的开放性和中立性。因此,ECMAScript和Ja...

2021-10-12 19:15:46 145

原创 美食杰-菜谱

美食杰–菜谱一级菜谱和二级菜谱图片效果template代码//一级菜谱和二级菜谱<el-tabs v-model="classifyName" type="border-card"> //一级菜谱遍历渲染 <el-tab-pane v-for="item in classify" :key="item.parent_type" :label="item.parent_name"

2021-10-10 21:07:03 244 4

原创 美食杰-个人简介

个人简介-图片图片1图片2在router文件夹中的index.jsimport space from '@/views/user-space/space.vue'import MenuList from '@/views/user-space/menu-list.vue'import Fans from '@/views/user-space/fans.vue'const router = new Router({ { path:'/space', name:'s

2021-10-09 20:41:11 152

原创 vue混入(mixin)

混入(mixin)的使用混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项。在src文件夹中mixins(show.js)在show.js里定义了混入对象 并通过export导出:export default { data(){ return { isShow:true } }, methods:{

2021-10-07 20:12:53 166 1

原创 vue2与vue3的不同之处

proxy与defineproperty的区别vue的数据劫持有两个缺点:无法监听通过索引修改数组的值的变化无法监听object 也就是对象的值的变化所以vue2.x中才会有$set 属性的存在proxy是 es6中推出的新 api,可以弥补以上两个缺点,所以 vue3.x版本用 proxy 替换object.defineproperty。Vue 的响应式原理中 Object.defineProperty 有什么缺陷?Object.defineProperty 无法监控到数组下标的变化,

2021-10-06 23:42:56 1031 1

原创 基于数据劫持实现的双向绑定 proxy与defineproperty的区别

Vue三要素响应式: 例如如何监听数据变化,其中的实现方法就是我们提到的双向绑定模板引擎: 如何解析模板渲染: Vue如何将监听到的数据变化和解析后的HTML进行渲染双向数据绑定是vue三要素之一下面是我们常见的基于数据劫持的双向绑定常见的基于数据劫持的双向绑定有两种实现,一个是目前Vue在用的Object.defineProperty,另一个是ES2015中新增的Proxy,而在Vue3.0版本后加入Proxy代替了Object.defineProperty基于数据劫持实现的双向绑定的特点

2021-10-05 23:53:20 183 1

原创 vue中的keep-alive

keep-alive的作用是什么?keep-alive可以实现组件缓存,当组件切换时,主要用于保留组件状态或避免重新渲染使用场景:比如有一个列表和一个详情,那么用户就会经常执行打开详情=>返回列表=>打开详情…这样的话列表和详情都是一个频率很高的页面,那么就可以对列表组件使用进行缓存,这样用户每次返回列表的时候,都能从缓存中快速渲染,而不是重新渲染常用的两个属性include/exclude,允许组件有条件的进行缓存两个生命周期activated/deactivated,用来得知当前组

2021-10-05 22:58:08 129 1

原创 vue-router 导航守卫

导航守卫导航守卫,也可以叫路由守卫,“导航”表示路由正在发生改变。vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航。有多种机会植入路由导航过程中:全局的, 单个路由独享的, 或者组件级的。类似于组件生命周期钩子函数, 把路由跳转分为很多过程,让你在这些过程中操作一些别的事。导航守卫分为三类:全局守卫,路由独享守卫和组件守卫。一共有七个钩子函数每个守卫方法接收三个参数:钩子函数一般有三个参数 (to,from ,next),但全局守卫中的全局后置钩子 afterEach

2021-10-04 22:28:20 260 1

原创 Vuex的五个属性

vuex是什么?Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。每一个 Vuex 应用的核心就是 store(仓库)。“store”基本上就是一个容器,它包含着你的应用中大部分的状态 (state)。Vuex 和单纯的全局对象有以下两点不同:1. Vuex 的状态存储是响应式的。2. 不能直接改变 store 中的状态。改变 store 中的状态的唯一途径就是显式地提交 (commit) mu

2021-10-03 00:19:42 361 1

原创 vue路由--Vue Router

这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar

2021-10-02 23:48:04 110 1

原创 美食杰-菜谱分类

代码效果图片代码想要实现上图效果,需要在router中index.js加上import create from '@/views/create/create.vue'{ path:'/create', name:'create', title:'菜谱大全', component:create}在script中的代码<script>import Stuff from './stuff'import Upload from './step-upl

2021-09-27 09:21:10 201 1

原创 美食杰轮播图

效果图片在home文件夹中的Home.vue中html内容<template> <div class="home"> <!-- 轮播 start --> <el-carousel :interval="5000" type="card" height="300px"> <el-carousel-item v-for="item in banners" :key="item._id"> <

2021-09-25 19:59:28 185 1

原创 美食杰项目-登录注册

内容精选

2021-09-24 16:05:06 187 1

原创 $(document).ready() 与window.onload的区别

Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法,它们的区别在于:1.window.οnlοad=function(){}是js原生的事件;2.$(function(){})是JQuery的方法;1.执行时间 window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。 $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕。 2.编写个数不同 wi

2020-11-03 19:55:04 392 1

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除