小白在线学前端-CSDN博客

原创【SVN】Please execute the ‘Cleanup‘ command的解决方案

背景项目中有个新的bug,当我们往下拉的时候，出现了如下的错误：Please execute the ‘Cleanup’ command.原因由于使用SVN更新文件出错，导致SVN中断解决方案方案一在项目根文件夹中右击点击TortoiseSVN选择Clan up选择Break Write locks点击ok方案二：如果方案一不行的话，可能是你的SVN操作挂起了下载sqlite3工具将sqlite3.exe文件解压缩到.svn目录的同级目录打开命令行工具，切换到.sv

2021-11-26 09:10:10 8575 1

原创微信小程序支付功能的实现

前言最近需要在微信小程序中用到在线支付功能，于是看了一下官方的文档，发现要在小程序里实现微信支付还是很方便的，如果你以前开发过服务号下的微信支付，那么你会发现其实小程序里的微信支付和服务号里的开发过程如出一辙，下面我就具体说一下小程序里微信支付的开发流程和注意点。开始第一步：开通微信支付和微信商户号第二步，获得用户的openid首页我们需要在小程序的客户端js中获取当前用户的openid,通过调用wx.login方法可以得到用户的code.wx.login({ success: func

2021-11-01 14:40:23 16450 3

原创 uni-app购物车的实现

前言在电商项目中，购物车是电商项目的灵魂，支付是电商项目的血液，电商项目中离不开购物车。开始了第一步加入购物车在vuex中新建一个store.js文件,并且在store.js 文件中添加如下4个初识化Store的实例对象// 1. 导入 Vue 和 Vueximport Vue from 'vue'import Vuex from 'vuex'// 2. 将 Vuex 安装为 Vue 的插件Vue.use(Vuex)// 3. 创建 Store 的实例对象const stor

2021-11-01 14:14:43 2777 1

原创常见的浏览器兼容性的问题及解决方案

浏览器兼容问题一：块属性标签float后，又有横行的margin情况下，在IE6显示margin比设置的大问题的症状：常见症状是IE6中后面的块被顶到下一行碰到的概率：90%（稍微复杂一点的页面都会碰到，float布局是重最常见的浏览器兼容问题·）解决方案：在flaot的标签的样式控制中加入 display：inline ,将其转化Wie行内属性备注：我们最常用的就是 div+CSS 布局了，而div就是一个典型的块属性标签，横向布局的时候我们通常都是用div float实现的，横向的间距设置如

2021-11-01 12:57:57 879

原创如何完成微信小程序的登录功能

前言微信小程序是一个轻量级的，不用安装包，就可以打开的一个小工具，那我们就看一下，微信小程序是如何登录的开始第一步，搭建基础页面。<template> <view class="login-container">  <uni-icons type="contact-filled" size="100" color="#AFAFAF"></uni-icons> <!-- 登录.

2021-10-27 20:58:12 4152 1

原创前端面试题

一、 $HTML， HTTP，web综合问题1、如何进行网站性能优化content方面减少HTTP请求：合并文件、CSS精灵、inline Image减少DNS查询：DNS缓存、将资源分布到恰当数量的主机名减少DOM元素数量Server方面使用CDN配置ETag对组件使用Gzip压缩Cookie方面减小cookie大小css方面将样式表放到页面顶部不使用CSS表达式使用<link>不使用@importJavascript方面

2021-10-20 21:48:44 403

原创 Vue Router的基本知识

编程使我快乐Vue-router的基本使用路由，其实就是指向的意思，当我点击页面上的首页按钮的时候，页面中就是显示首页的内容，如果点击页面上的关于按钮，页面就显示关于的内容。Home按钮==>首页内容，关于按钮==>关于的页面，也可以说是一种映射，所以在页面上有两个部分，一个是点击部分，一个是点击之后，显示内容的部分。路由模块的本质就是建立起url和页面之间的映射关系。点击之后，怎么做到正确的对应，比如，当我点击首页按钮，页面中就显示home的内容，这就要在js文件中进行路由的配

2021-10-16 20:39:58 1177 4

原创 vue必问面试题

????1.请讲述一下你对VUE的MVVM的理解MVVM 是 Model-View-ViewModel的缩写，即将数据模型与数据表现层通过数据驱动进行分离，从而只需要关系数据模型的开发，而不需要考虑页面的表现，具体说来如下：Model代表数据模型：主要用于定义数据和操作的业务逻辑。View代表页面展示组件（即dom展现形式）：负责将数据模型转化成UI 展现出来。ViewModel为model和view之间的桥梁：监听模型数据的改变和控制视图行为、处理用户交互。通过双向数据绑定把 View 层和 M

2021-10-13 20:27:39 1024

原创 ES6的新特性

ES6的新特性let关键字作用和Var一样let k；let b,c,d//初识值let e=100let声明变量的特性变量不可以重复声明，为了防止变量名污染let star='小米'let star='小明'块级作用域，只在代码块中有效，如果出了代码块中无效{ let girl='翠花'}console.log(girl)不存在变量提升console.log(obj)let obj=123131不影响作用域链<body>

2021-10-13 19:06:50 228

原创学习Vue看这个就够了(下)

学习Vue看就够了(下)Vue全家桶-Vuex1.什么是VuexVuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理数据，以相应的规则保证状态以一种可预测的方式发生变化，vuex是Vue官方推荐的集中式状态管理机制2.Vue中存的什么多个组件共享状态，才存储在Vuex中某个组件中的私有数据，依旧存储在Data中例如：登录的用户名需要在首页，个人中心、结算页面使用，用户名存在vuex中文章详情的数据，只有在文章详情页查看，在自身data中声明3.为

2021-10-07 20:20:24 706

原创学习Vue看这个就够了（上）

vue总结VUE基础一、什么是vue官方给出的概念是：Vue(类似于View)是一套用于构建用户界面的前端框架构建用户界面用Vue往html页面中填充数据，非常的方便框架框架是一套现成的解决方案，程序员只能遵守框架的规范，去编写自己的业务功能要学习的vue，就是在学习vue框架中规定的用法！vue的指令、组件(是对UI结构的复用)、路由、Vuex、Vue组件库二、Vue的两个特性数据驱动视图数据的变化会驱动视图自动更新好处是：程序员只管把数据维护好，那么页面

2021-10-05 22:38:14 4445 2

原创 ES6中的类的使用

ES6中的类和对象对象：在JavaScript中，对象是一组无序的相关属性和方法的集合，所有的事物都是对象，例如字符串、数值、数组、函数等对象是由属性和方法组成的：属性：事物的特征，在对象中用属性来表示(手机的颜色，存储)方法：事物的行为，在对象中用方法来表示(手机可以干什么，比如打游戏)类 class在ES6中新增了类的概念，可以使用**class**关键字声明一个类，之后以这个类来实例化对象类抽象了对象中的公共部分，它泛指某一大类(class)对象特指的是某一个，通过类实例.

2021-09-29 21:21:44 558

原创 Vue3登录之QQ登录

如何设置QQ登录步骤：有一个网站，且已备案。网站需要有QQ登录的逻辑（登录页面，回跳页面）。然后再QQ互联上进行身份验证，审核通过然后在QQ互联上创建应用，应用需要域名，备案号，回调地址。审核通过。得到：应用ID 应用key 回调地址。才能完成QQ登录。（以上四个步骤，工作后大概率由后台或运维完成）注意：id和uri都不能修改，否则无效。如果在本地的时候使用QQ互联由于域名是需要备案的所以我们写一个已经被过案的域名www.corho.com和localhost不一致无法回调.

2021-09-28 08:48:29 1198 1

原创 Vue中第三方登录

如何设置QQ登录步骤：有一个网站，且已备案。网站需要有QQ登录的逻辑（登录页面，回跳页面）。然后再QQ互联上进行身份验证，审核通过然后在QQ互联上创建应用，应用需要域名，备案号，回调地址。审核通过。得到：应用ID 应用key 回调地址。才能完成QQ登录。（以上四个步骤，工作后大概率由后台或运维完成）注意：id和uri都不能修改，否则无效。如果在本地的时候使用QQ互联由于域名是需要备案的所以我们写一个已经被过案的域名www.corho.com和localhost不一致无法回调.

2021-09-26 08:40:37 1444

原创 Vue3封装面包屑的插件

前言在elementUI中有一个面包屑导航，是怎样做到的，我们今天就写一下使用Vue3中学到的知识·封装一个自己写的插件。# 开始啦！！简单的封装封装一个简易的面包屑组件，适用于两个场景，大致的步骤是：准备静态的基础结构代码，新建一个bread.vue的一个组件代码如下：这是基础的布局<template> <div class='xtx-bread'> <div class="xtx-bread-item"> <Rou

2021-09-24 21:50:51 486

原创 Vue3分页插件的封装

分页组件的封装分页的本质：分批次查询数据（基于页码page和每页条数pagesize),后端接收到分页参数后，会基于这些参数查询数据库，然后基于数据库进行分页，基于SQL语句分页组件实现的步骤分页基础的布局，依赖数据分析。分页内容逻辑，完成切换效果。接收外部数据，提供分页事件。落地的代码分页的基础布局，在src/component/libray中新建一个pagination.vue的文件，基本结构<template> <div class="xtx-pagina

2021-09-23 21:35:41 683

原创 Vue3中你不知道的那些事！！！

前言今天在写项目中的一个小组件，感觉挺不错的，然后分享给大家，如果以后需要使用这个就，看一下这个博客就行先说一下SKU和SPU的概念：SPU（Standard Product Unit）标准化产品单元。是商品信息聚合的最小单位，是一组可复用、易检索的标准化信息的集合，该集合描述了一个产品的特性。通俗点讲，属性值、特性相同的商品就可以称为一个SPU。SKU（Stock Keeping Unit）库存量单位，即库存进出计量的单位，可以是以件、盒、托盘等为单位。SKU是物理上不可分割的最小存货单元。在

2021-09-21 23:57:29 518

原创 Vue3中封装骨架屏的效果

前言骨架屏就是在页面数据尚未加载前先给用户展示出页面的大致结构，直到请求数据返回后再渲染页面，补充进需要显示的数据内容。常用于文章列表、动态列表页等相对比较规则的列表页面。今天我们就讲一下，如何在Vue3中封装骨架效果为什么需要骨架屏？当用户刚打开网页的时候，后台还没有返回数据，页面没有办法渲染。如果用户正好网络状态不是很好，如果页面什么都不显示的话，用户极有可能直接选择退出了。骨架屏可以起到一个占位的作用，用户看到后就能知道此处有内容正在加载。二、如何封装？通过插件的方式，注册为全局组

2021-09-19 23:32:31 1061

原创 HTML+CSS之--------＞布局

前言前端中有很多的布局方式，例如flex布局，rem布局，圣杯布局，双飞翼布局.，好了我们废话不多说马上开始，lest go！！1开始啦1、利用定位的方式实现两侧固定，中间自适应给父盒子设置左右的padding值给左右盒子的 width（宽度）设置父盒子的padding值，然后分别定位到padding的地方去中间的盒子自适应代码如下：<!DOCTYPE html><html lang="en"><head> <meta charset

2021-09-18 20:20:51 91

原创一文带你搞懂RBAC权限模式

前言权限一句话来理解就是对资源的控制，对web应用来说就是对url的控制，关于权限可以毫不客气的说几乎每个系统都会包含，只不过不同系统关于权限的应用复杂程序不一样而已，现在我们在用的权限模型基本上都是以RBAC为基础进行扩展的，我们今天就将RBAC权限模型进行下介绍。开始RBAC的介绍RBAC是基于角色的访问控制（Role-Based Access Control ）在RBAC中，权限与角色相关联，用户通过成为适当角色的成员而得到这些角色的权限。这就极大地简化了权限的管理。这样管理都是层级相互依赖的

2021-09-15 20:54:52 1345

原创前端JS继承的方式

前置JavaScript继承是一种允许我们在已有类的基础上创建新类的机制；它为子类提供了灵活性，可以重用父类的方法和变量。继承的过程，就是从一般到特殊的过程。开始啦一、原型链继承的方式实现的方法：设置B.prototype=new A 即可（其中B为子类，A为父类）特点：它把父类中的私有属性和共有属性都继承到了子类的原型链上（new A得到一个实例对象，该对象具有构造函数A的私有和公有属性）核心：原型链继承方式并不是将父类的所有属性克隆一份给了子类，而是在父类和子类之间建立了原型链的连接，如果

2021-09-13 23:57:51 165

原创 Vue中的请求拦截器和响应拦截器

前置大家好，我又来了，我们今天就讲一下什么是请求拦截器，和请求拦截器的作用，好了，多余的话我就不说了，马上开始今天的讲解开始啦请求拦截器请求拦截器的作用是：在请求发送前进行一些操作，例如在每个请求体里面加上token,统一做了处理的，如果要更改也是非常的容易。关于拦截这里只说原理，前端的请求，最终离不开Ajax,像Vue的Vue-Resource、Axios,都只是对Ajax进行了统一的封装，它暴露出来的拦截器，其实就是写了一个方法，把Ajax写在这个方法里面（我们先说请求拦截器）

2021-09-11 21:21:29 8604 5

原创 VUE3----setup函数的使用

前置大家好，今天我们讲一下Vue3中的setup的使用，Vue2我们都学过，但是Vue3，也是要学习的，因为现在非常多的大厂，已经开始使用Vue3啦，Vue3和Vue2其实还是有一点不一样的，Vue3更接近于底层的代码，好了，我们马上开始今天的讲解开始啦参数我们先讲一下setup函数中的两个参数1、props在setup函数中的第一个参数是props。正如在一个标准组件中所期望的那样，setup函数中的props是响应式的，当传入新的props的时候,它即将被更新// 这个就是pro

2021-09-10 21:46:39 1267

原创 React第一天（学习笔记）

React第一天（笔记）React的概述什么是ReactReact 是一个用于构建用户界面的**JavaScript库**用户界面：HTML页面（前端）React主要是用来写HTML的页面，或构建Web应用如果从MVC的角度来看的话React仅仅是视图层（V）,也就是只负责视图的渲染，而并非提供了完整的M和C的功能React的特点声明式你只要描述UI（HTML）看起来是什么样的，就跟写HTML一样React只负责渲染Ui，并在数据发生变化的时候更新UIconst jsx=<d

2021-09-09 19:07:56 141

原创 Vue的钩子函数[‘路由导航守卫’、keep-alive、生命周期函数]

前言说起Vue的钩子函数，可能很多的人只停留在一些简单常用的钩子(creataed,nouted)，而且对应里面的区别，生命时候该用什么钩子，并没有仔细的去研究过，并且Vue的生命周期在面试中，是出现的比较高频的考点,Vue生命周期简介下面是我画的一个流程图：我们可以根据上面的图片可以明显的看出，在Vue2.0都包括了哪些生命周期函数生命周期的探究对于执行顺序和什么时候执行，看上面两个图基本了解了，下面我们将结合着代码去看看钩子函数的执行下面的代码可以直接复制出去执行<!

2021-09-08 16:39:02 151

原创 vue路由传参的三种基本方式

现有如下场景，点击父组件的li元素跳转到子组件中，并携带参数，便于子组件获取数据。父组件中 <li v-for="article in articles" @click="getDescribe(article.id)">方案一：methods: getDescribe(id) {// 直接调用$router.push 实现携带参数的跳转 this.$router.push({ path: `/describe/${id}`,

2021-09-04 20:52:07 48

原创 javascript的事件委托

文章目录前言开始一、事件委托是什么？二、事件委托的优点事件委托的缺点为什么要用事件委托事件委托怎么实现总结前言hello,我来啦，今天发得有点晚，请各位读者大大，多多包涵，那今天我们讲一下什么是事件委托,以及事件委托的理解开始一、事件委托是什么？它还有一个名字叫事件代理，JavaScript高级程序中是这样讲的：事件委托就是利用事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件，也就是说，通过它你可以把事件处理器添加到一个上级元素上，这样就避免了把事件处理器添加到多个子元素上，当我

2021-09-02 23:47:30 161

原创一文带你搞定svg-icon的使用

前置有的时候，我们经常在业务中会需要使用字体图标的场景，比如同一个图标在不同的地方显示不同的颜色，这个时候我们使用字体图标就非常的合适，这篇文章我们主要讲的是在Vue中显示的字体图标`svg-icon`的使用# 开始啦！第一步：下载相应的**包**或者**插件**（会提示没有安装xml-loader,只需要安装下xml-loader，重启下项目就可以解决报错）## 使用npmnpm install vue-svg-icon xml-loader -D## 使用yarn yarn add .

2021-09-01 20:50:21 14436 8

原创一文带你搞懂MVVM和MVC的区别

基本定义MVVM的基本定义MVVM即Model---View---ViewModel的简写，即模型—视图—视图模型，模型(Model)指的是后端传递的数据，视图（View）指的是页面中所看到的页面，视图模型（ViewModel）是MVVM模式的核心，它是链接View和model的桥梁,它有两个方向:1). 一是将模型（Mode）转化成视图*（View）,即将后端传递的数据转化为我们所看到的页面，实现的方式是数据绑定2). 二是将视图（View）转化为模型（Model），即将看到的所有页面转化为后端

2021-08-31 22:35:27 451

原创 Vue后台管理系统token

Vue后台管理系统token什么是Tokentoken是计算机术语：令牌，令牌是一种能够控制站点占有媒体的特殊帧，以区别数据帧及其他控制帧。token其实说的更通俗点可以叫暗号，在一些数据传输之前，要先进行暗号的核对，不同的暗号被授权不同的数据操作。基于 Token 的身份验证方法使用基于 Token 的身份验证方法，在服务端不需要存储用户的登录记录。大概的流程是这样的：1.客户端使用用户名跟密码请求登录2.服务端收到请求，去验证用户名与密码3.验证成功后，服务端会签发一个 Token，再把

2021-08-30 20:52:31 1023

原创 JavaScript函数（看这个就可以了）

函数函数的作用：函数：function,是被设计为执行特定任务的代码块函数可以把具有相同的或者相似逻辑的代码“包裹”起来，通过函数调用执行，为了代码的多次使用（重用）（复用）一次编写，多次使用函数的基本使用函数的声明语法function 函数名(){ 函数体(函数要做的事)}例如：function sayHi(){ document.write('hhai~~~~')}函数的调用：函数只声明，不调用，不发挥作用，代码不执行，函数名()例如：sa.

2021-08-29 14:32:35 260

原创 JavaScript中Dom(第一天，最详细的笔记)

JavaScript中Dom(第一天，最详细的笔记)1. 什么是domDom全称(Document Object Model)[文件对象模型]，Dom是浏览器中提供的一套专门用来操作网页内容的功能，它的作用是，开发网页内容特效和实现用户交互2. 什么是DOM树Dom树：将HTML文档以树形结构直观的表现出来，我们称之为文档树或者DOM树，表示描述网页内容关系的名词，作用是文档树直观的体现了标题和标签之间的关系<!DOCTYPE html><html lang="en"&

2021-08-28 18:51:57 114

原创 VUE的生命周期

vue的生命周期beforeCreate（创建前）在数据观测和初始化事件还未开始created（创建后）完成数据观测，属性和方法的运算，初始化事件，$el属性还没有显示出来beforeMount（载入前）在挂载开始之前被调用，相关的render函数首次被调用。实例已完成以下的配置：编译模板，把data里面的数p据和模板生成html。注意此时还没有挂载html到页面上。mounted（载入后）在el 被新创建的 vm.$el替换，并挂载到实例上去之后调用。实例已完成以下的配置：用上面编译好的h

2021-08-28 00:20:23 74

原创推荐26个GitHub上好玩又有挑战的前端项目（涵盖初中高阶）

初级篇这里一般适用于刚入门前端的同学，一般入门前端都是从html和css开始的，应该让这些同学提起对前端的兴趣，因此初级篇选用几个比较有趣的css库来让同学入门前端。animate`animate`是一个css动画库，动画内容一般也是我们所熟悉的，例如渐入、渐出、弹跳、旋转、抖动等特效。ppt里面的许多特效在`animate`都能找到。而且使用简单，只需引入库并添加相关css即可。![在这里插入图片描述](https://img-blog.csdnimg.cn/b89247256669496e83

2021-08-25 00:23:36 2549

project-toutiao.rar

hm-big-event.rar

空空如也