自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 git的基本详解

一、Git的介绍:Git 是一个开源的分布式版本控制系统,用于敏捷高效地处理任何或小或大的项目。Git 是 Linus Torvalds 为了帮助管理 Linux 内核开发而开发的一个开放源码的版本控制软件。Git 与常用的版本控制工具 CVS, Subversion 等不同,它采用了分布式版本库的方式,不必服务器端软件支持。二、安装地址Git 各平台安装包下载地址为:http://git-scm.com/downloadsGit的操作流程:三、 Git的工作区 、暂存区和版本库工作区

2021-11-04 09:30:23 141

原创 移动端适配

移动端适配视口viewport:<meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=0,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0"><meta>标签中定义了一些元数据信息,通过设置<meta name = "viewport">,提供有关 视口初始大小 的信息,供移动设备 使用。属性值为

2021-10-22 20:24:40 748

原创 跨域的解决⽅案!!快一起来看看吧!

跨域的解决⽅案⽬前有三种主流解决⽅案:跨域是浏览器做出的限制,和后端没关系1. 是jsonpjsonp实现原理:主要是利用动态创建script标签请求后端接口地址,然后传递 callback参数,后端接收callback,后端经过数据处理,返回callback函数调用的形式, callback中的参数就是json3. 是代理(前端代理和后端代理)前端代理我在vue中主要是通过vue脚手架中的config中的index文件来配置的,其中 有个proxyTable来配置跨域的3. 是CORS

2021-10-14 20:21:58 82

原创 $route和$router的区别

route和route和route和router的区别1. $route 是“路由信息对象”,包括 path,params,hash,query,fullPath,matched,name 等路由信息参数。this.$router.push({ path:'/home', 路由地址 name:'home', 路由名字 query:{name:'张三'}, 路由参数 相当于:/home?name= '张三' params:{name:'李四'}

2021-10-13 20:21:42 245

原创 美食杰项目---菜品主页展示

美食杰项目—菜品主页展示效果展示:从内容精选点击进入菜品首页把菜品页所需要要的数据进行渲染到页面上当点击收藏时切换到已收藏,实现来回切换效果输入评论点击提交时,让评论的数据显示在下方页面中效果图展示:点击进入菜品首页数据渲染,及收藏,已收藏切换数据渲染评论提交显示具体实现请看如下代码及理解:1.detail.vue把头部,内容及评论分三个组件在此组件中请求数据以及保存数据<template> <div class="menu-detai

2021-10-12 20:29:48 202

原创 美食杰项目--菜谱大全二

实现效果展示:点击“炒”,“蒸”等让数据显示出来每次显示5条数据数据比较多的时候分页的效果,默认显示5条数据效果图展示当他点击加载loading时,出现遮罩层的效果1.显示数据

2021-10-11 20:20:19 122

原创 2021前端面试题终结版

1.如何实现⼀个div垂直居中(⾄少3种⽅法)\color{YellowGreen}{1. 如何实现⼀个div垂直居中(⾄少3种⽅法) }1.如何实现⼀个div垂直居中(⾄少3种⽅法)答:其实实现水平垂直剧中方法有很多:第一种:定位:第一种思路:通过给div设置绝对定位,并且left,right,top,bottom设置为0,margin:auto即可 以水平垂直居中第二种思路:通过给div设置绝对定位,.left为50%,top为50%,再给div设置距左是自身的一半 即:margin-

2021-10-10 20:38:50 89

原创 美食杰项目----菜谱大全

美食杰项目----菜谱大全实现效果介绍:点击菜谱tab切换,类似于一个二级菜单当他点击家常菜切换颜色,当它刷新的时候颜色不会掉点击工艺,口味切换,也类似于一个二级菜单当点击“炒”“蒸”时切换颜色,当它刷新的时候颜色不会掉和展开效果图1.2效果图3.4代码展示如下:data中存放的数据classify:[],//存储tab切换的所有数据classifyType:‘1-1’,//tab切换选中项(二级路由)classifyName:‘1’,//定义刷新tab得值(一级路由)/

2021-10-09 20:34:56 181

原创 美食杰项目---个人页和他人主页

美食杰项目—个人页和他人主页跳转个人主页。跳转他人主页。点击他人关注或取消关注。点击他人菜谱,粉丝及关注。效果图展示点击跳转到个人空间,个人空间没有关注和取消关注。点击个人跳转如下图:点击跳转到他人的主页,可以点击关注和跳转。点击他人跳转如下图:space.vue空间页总体思路1.显示别人的空间a.地址栏中如有userid 则显示对应的用户数据2.显示自身空间a.如果没有userid 则默认显示自己信息b.如果在菜谱中 点击自己 也是有userid传递c

2021-10-08 20:17:37 241

原创 HTTP状态码

http状态码当浏览者访问一个网页时,浏览者的浏览器会向网页所在服务器发出请求。当浏览器接收并显示网页前,此网页所在的服务器会返回一个包含HTTP状态码的信息头(serverheader)用以响应浏览器的请求。 HTTP状态码的英文为HTTP Status Code。下面是常见的HTTP状态码:200 - 请求成功301 - 资源(网页等)被永久转移到其它URL404 - 请求的资源(网页等)不存在500 - 内部服务器错误1xx (临时响应)表示临时响应并需要请求者继续执行操

2021-10-07 20:38:19 47

原创 路由导航守卫

vue-router有哪几种导航钩子( 导航守卫 )?vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航。例如判断登录信息:没登录全部跳到登录页。判断必要操作是否进行没进行的话中断跳转。**参数或查询的改变并不会触发进入/离开的导航守卫。**你可以通过观察 $route 对象响应路由参数的变化)来应对这些变化,或使用 beforeRouteUpdate 的组件内守卫。分为三大类:全局守卫、路由守卫、组件守卫全局前置守卫你可以使用 router.beforeEach 注册一个

2021-10-06 23:29:45 102

原创 vue面试题,快来看一看吧!!

1:说说你对 SPA 单页面的理解?SPA:全称(single-page application) 概念:仅在Web页面初始化时加载相对应的代码。一旦页面加载完成,SPA不会因为用户的操作而进行页面的重新加载或者跳转。利用的是路由机制实现代码的变换,避免页面的重新加载优点: • 用户体验好、快,内容的改变不需要重新加载整个页面,避免了不必要的跳转和重复渲 染; • 基于上面一点,SPA 相对对服务器压力小; • 前后端职责分离,架构清晰,前端进行交互逻辑,后端负责数据处理;缺点:

2021-10-04 23:16:37 71

原创 vuex理解

Vuex的五个属性state, getters, mutations, actions, modules。state:vuex的基本数据,用来存储变量。geeter:就像计算属性一样,getter 的返回值会根据它的依赖被缓存起来,且只有当它的依赖值发生了改变才会被重新计算。mutation:每个 mutation 都有一个字符串的 事件类型 (type) 和 一个 回调函数 (handler)。这个回调函数就是我们实际进行状态更改的地方,并且它会接受 state 作为第一个参数Action 类似

2021-10-03 23:59:25 187

原创 组件间传参

props和emit父组件向子组件传递数据是通过prop传递的,子组件传递数据给父组件是通过emit父组件向子组件传递数据是通过prop传递的,子组件传递数据给父组件是通过emit父组件向子组件传递数据是通过prop传递的,子组件传递数据给父组件是通过emit触发事件来做到的。2.中央事件总线(bus)如果两个组件不是父子关系呢?这种情况下可以使用中央事件总线的方式。新建一个Vue事件bus对象,然后通过bus.emit触发事件,bus.emit触发事件,bus.emit触发事件,bus.on监.

2021-10-03 23:31:44 1186 1

原创 路由参数传递

路由参数传递传递参数主要有两种类型:params和queryparams的类型配置路由格式:/router/:id传递的方式:在path后面跟上对应的值传递后形成的路径:/router/123,/router/abcquery的类型配置路由格式:/router,也就是普通配置传递的方式:对象中使用query的key作为传递方式传递后形成的路径:/router?id=123,/router?id=abc后面跟的是字符串形式,想在to里面写东西写成对象的形式,{},对象里面有键和值,要想传递

2021-10-02 23:11:38 134

原创 回流和重绘

回流和重绘1.html加载时发生了什么在页面加载时,浏览器把获取到的html代码解析成一个dom树,dom树里包含了所有html标签,包括display:none隐藏,还有用js动态添加的元素等浏览器把所有样式(用户定义的css和用户代理)解析成样式结构体dom tree和样式结构体组合后构建render tree,render tree类似与dom tree,但区别很大,因为render tree能识别样式,render tree中每个node都有自己的style,而且render tree

2021-10-02 23:05:34 73

原创 vue生命周期相关面试题

vue生命周期相关面试题总共分为8个阶段:创建前/创建后,载入前/后,更新前/后,销毁前/后.\color{skyblue}{总共分为8个阶段:创建前/创建后,载入前/后,更新前/后,销毁前/后}.总共分为8个阶段:创建前/创建后,载入前/后,更新前/后,销毁前/后.创建前/后:在beforemount阶段,vue实例的$el和data都初始化了,但挂载 之前还是为虚拟的dom节点,data.message还未替换。在mounted阶段,vue 实例挂载完成,data.message成功渲染。更

2021-09-28 20:04:35 289

原创 add todo效果

Add todo效果图首先创建一个vue的项目当输入内容是进行添加点击筛选条数时进行筛选点击查看所有筛选所有的条数点击未完成筛选未完成的点击已完成筛选已完成的Home.vue<template> <div class="home"> <h3 class="title">add todo</h3> <div class="title-inp"> <div class="inp">

2021-09-28 08:02:17 203 2

原创 美食杰项目--首页

美食杰效果图展示需要实现的一些效果头部轮播图内容:需要没5个加载一次头部的效果代码\color{YellowGreen}{头部的效果代码}头部的效果代码<template> <el-header style="height: auto;"> <div class="header"> <div class="header_c"> <el-row type="flex" justify="start" a

2021-09-27 08:20:06 179 2

原创 放大镜效果

放大镜效果展示:注:图片自己修改一下路径就可以啦!\color{red}{注:图片自己修改一下路径就可以啦!}注:图片自己修改一下路径就可以啦!<!doctype html><html><head> <meta charset="UTF-8"> <title>放大镜</title> <style> * { margin: 0; p

2021-09-26 16:51:41 67 2

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

编辑个人资料效果展示:实现步骤:首先找到登录也如图一)需要先点击跳转到个人空间(如图一)点击编辑个人资料跳转到 (如图2)通过编辑资料跳转到编辑

2021-09-26 15:35:42 111 2

原创 ES6面试题必备!

ES6面试题1. Es6与ECMAScript 2015的关系Es6既是一个历史名词,也是一个泛指,含义是5.1版以后的JavaScript的下一代标准,涵盖了ES2015、Es2016、Es2017等等,而Es2015则是正式名称,特指该年发布的正式语言标准。本书中提到“Es6”的地方,一般是指Es2015标准,但有时也是泛指“下一代JavaScript语言”。2. Es6声明变量的六种方法Var、function、let、const、import、class3. 4.var、

2021-09-24 17:05:35 238 2

原创 用户登录和注册效果实现,简单易理解。

登录和注册的效果展示文件具体所在位置注意:需安装Elementnpm i element-ui -S安装axiosnpm install axios登录页建一个login.vue<template> <div class="login-section"> <!-- :rules="rules" --> <el-form label-position="top" label-width="1

2021-09-24 08:00:14 401 2

原创 vue面试题必看!

vue面试题1.vue.js的两个核心是什么?数据驱动和组件系统:数据驱动:ViewModel,保证数据和视图的一致性。组件系统:应用类UI可以看作全部是由组件树构成的。2.双向数据绑定的原理?vue实现数据双向绑定主要是:采用数据劫持结合发布者-订阅者模式的方式,通过 Object.defineProperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应监听回调。3. v-if和v-show有什么区别?v-show 仅仅控制元素的

2021-09-22 20:12:38 1081 2

转载 vue.3了解

vue.31.vue简介:简介了解2.vue3学习:vue3学习知识点必看3.vue的特点1)性能的提升打包大小减少了41%初始化渲染快了55%,更新渲染快了133%内存占有减少54%2)源码的升级使用proxy代替definedProperty实现了响应式数据重写了虚拟dom3)集合了 TypeScript4)新的特性4.有两种创建方式1)通过脚手架创建vue-cilvue create vue32)Vite创建npm init @vitejs/app5.vue3方法

2021-09-21 20:12:34 194 3

空空如也

空空如也

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

TA关注的人

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