自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(59)
  • 问答 (1)
  • 收藏
  • 关注

原创 vue封装回到顶部

vue封装回到顶部home.vue<template> <div> <p v-for="(item, index) in 200" :key="index">{{ item }}</p> <Gotop @Gotop="click_gotop"></Gotop> </div></template><script>import Gotop from "../compon

2020-10-24 14:45:26 9

原创 vue相关知识点

vue面试总结1、vue的生命周期breforCreate()——创建前在vue被创建前el和data都没有被初始化,没有methods,data,computed等方法created()——创建后在vue被创建后,这里可以调用methods方法来改变data的值,获取computed,写一些异步的网络请求,因为这个时候data已经通过了Object.defineProperty的方法劫持和添加观察者模式,数据已经能够支持双线数据绑定了,created会在munted前执行,所以同样的请求时间的话

2020-10-24 14:44:48 7

原创 处理“start value has mixed support, consider using flex-start instead”编译警告

这个问题呢其实很简单,你先这样,再这样,再那样 然后再这样,最后就是这样了 吼吼吼吼吼吼吼吼吼吼吼吼吼吼吼吼康康 你的 display:flex它的justify-content:start改为 space-between敢敢单单!

2020-10-15 18:20:52 46

原创 vue封装回到顶部

vue封装回到顶部home.vue<template> <div> <p v-for="(item, index) in 200" :key="index">{{ item }}</p> <Gotop @Gotop="click_gotop"></Gotop> </div></template><script>import Gotop from "../compon

2020-09-29 21:44:28 41

原创 vue中封装全局组件方法

vue项目中全局注册js文件 js文件便捷添加样式vue项目中全局注册js文件首先是创建一个js文件叫Toast.jsexport const Toast = { Toast1: () => { var p = document.createElement("div") p.innerHTML = "11" //调用下面的style方法 style(p, { 'color': 'red', 'border': '1px solid

2020-09-28 22:51:51 64

原创 vue封装弹框

vue弹出框的封装和点击弹出框外部的事件触发封装主要利用vue之间的组件通信Home.vue 父组件<template> <div> <div class="box_popup"> <div class="popup_title">弹出框</div> <button @click="tan">点击弹出弹出层</button> <!-- title

2020-09-25 00:03:55 48

原创 微信小程序实现todolist

微信小程序复习第二天自己实现一个todolist的效果,首先是wxml页面布局<!--pages/home/home.wxml--><view> <view class="box_top">TODOLIST</view> <view class="box_center"> <input value="{{value}}" bindinput="changevalue" class="todolist_input"><

2020-09-23 21:14:30 93

原创 微信小程序实现购物车,底部导航栏的配置,微信小程序实现路由跳转

微信小程序复习第一天微信小程序实现购物车首先是微信静态的页面<!--购物车页面--><view> <!-- 空状态 --> <van-empty description="购物车空空如也~" wx:if="{{cartList.length <= 0 ? !isShow :isShow}}" image="/assets/catr_details.png"> <van-button type="danger" class="bot

2020-09-22 22:01:03 68

原创 手机H5支付流程概述

手机H5支付流程概述昨天写了一个手机微信小程序的支付流程,今天自己参考了微信小程序官方文档,找到了浏览器支付调用微信支付的方法以及支付过程,还是老样子,先来看看这个思维导图,理解了昨天的那个,今天这个也就看起来比较简单明了了,还是逐步分析1,请求下单()​ 这一步是由用户在浏览器通过点击支付按钮调起来的,这一步之后会在商户的后台**保存这个订单 **2,调微信支付接口下单()​ 这一步是由商户的后台来直接请求微信支付后台的,这时候微信支付后台会返回给商户后台跳转的URL商户后台收到后来返回给前端

2020-09-21 21:46:18 45 1

原创 微信小程序支付流程

微信小程序支付流程其实实现微信小程序的支付的话与微信小程序的登录有异曲同工之妙,都是客户端,与服务器和微信后台进行的交互来实现的,微信小程序的支付接口需要配置微信小程序后台的配置,这个配置是需要开发者进行商户认证的,个人是不能调用这个接口的,下图就是微信小程序需要用到的一些接口和数据准备工作做好后先来简单了解一下微信小程序的支付流程,它如何实现前后端与微信服务端进行处理的,下图是微信小程序的支付流程详解:根据这个图的话可以看到一个与小程序登录十分相似的关系图,看起来十分的复杂,让我们慢慢捋一遍这个

2020-09-20 22:08:59 34

原创 css的样式优先级,哪些情况可触发reflow,哪些方法可以用作javascript异步模式的编程?,谷歌浏览器如何显示12px下的字号

css的样式优先级<style>.main{color:blue}span{color:green}</style><div style="color:red !important"class=""main""><span>123</span></div>问题:123的颜色是!important>行内样式>id选择器>类选择器>标签选择器>通配符>继承在这道题目:对于

2020-09-18 22:03:24 86

原创 ue后台管理系统项目总结

vue后台管理系统项目总结这个项目是自己从真正的意义上开发了一个比较完整的后台管理系统,确实学习到了很对,与自己之前的写过的那些页面,项目确实有很多的不同,逻辑的处理要比普通的项目多,也是比较复杂的,总的来说今天完成了这个项目确实收获了很多,学到了很多的知识,项目过程中遇到的问题也是与同学一起探究解决的现在我对项目中遇到的问题进行在总结和反思问题lodash实现防抖节流1,安装lodashcnpm i lodash -S1第二步引入main.js中import _ from 'lodas

2020-09-18 00:01:33 21

原创 Element UI 左侧折叠导航栏配合el-asid文字闪烁的问题,element-UI 中beforeLeave用法,echarts 无法获取属性“getAttribute”的值

Element UI 左侧折叠导航栏配合el-asid文字闪烁的问题[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-eayAJOoj-1600259160168)(C:\Users\22725\Desktop\对对对.gif)]问题描述 如图所示解决的方法也是自己在网上误打误撞找到了首先是 给el-menu定义一个class样式 <el-aside width="initial" class="home_aside"> <el-menu

2020-09-16 20:26:50 86

原创 新建文本文档 (2)

$refs中设置style时style时undefind问题由于vue特殊的生命周期机制,在vue的生命周期中 ,created不能够来拿到DOM元素,所以,this.$refs.xxx就不能取到,这个时候就需要在mounted中去设置style不能再created之前vue 官网中ref 下有一段话 “关于 ref 注册时间的重要说明:因为 ref 本身是作为渲染结果被创建的,在初始渲染的时候你不能访问它们 - 它们还不存在!$refs 也不是响应式的,因此你不应该试图用它在模板中做数据绑定。”也

2020-09-15 22:06:39 20

原创 element ui中自定义选择器,this.$nextTick理解和用法

element ui中自定义选择器 怎么拿到自定的value和lable请选择分类: <el-cascader v-model="value" :props="props" :options="options" @change="handleChange"></el-cascader> //value绑定的是选择后的值 //props因为我们要用到自己的数据,二三级的数据需要进行匹配这里就是对渲染的数据进行重新定义了

2020-09-14 21:31:58 119

原创 css中的BFC

css中的BFCBFC(Block Formatting Context)格式化上下文,是Web页面中盒模型布局的CSS渲染模式,指一个独立的渲染区域或者说是一个隔离的独立容器。形成BFC的条件​ 1、浮动元素,float 除 none 以外的值;​ 2、定位元素,position(absolute,fixed);​ 3、display 为以下其中之一的值 inline-block,table-cell,table-caption;​ 4、overflow

2020-09-11 21:56:52 21

原创 element UI 表单自定义验证,css水平且垂直居中方法

element UI 表单自定义验证element UI提供了一种内部的表单验证,但是这种方法不能够来进行复杂的验证,如邮箱,手机号等的验证需要用到自定义验证首先是element UI 提供的基础表单验证 <el-form ref="addUserForm" :label-position="labelPosition" label-width="70px" :model="formLabelAlign

2020-09-09 21:48:34 158

原创 lodash实现防抖节流,图片懒加载

net::ERR_CONNECTION_TIMED_OUT这个问题是因为,断开网络后,又继续开始vue服务时提示的报错,关闭项目服务,重新启动项目就可以了。。。。lodash实现防抖节流1,安装lodashcnpm i lodash -S第二步引入main.js中import _ from 'lodash'Vue.prototype._ = _第三步页面中引入import _ from "lodash";第四步运用方法searchUsers: _.debounce(functio

2020-09-08 23:38:12 50

原创 Mosk数据,vue后台登录的实现

Mock数据:模拟数据mockjs官网:http://mockjs.com/mockjs官方文档:https://github.com/nuysoft/Mock/wiki/Getting-Started第一步 安装mockjsnpm install mockjs第二步 创建一个mock目录生成mock数据course.jsimport Mock from "mockjs";//mock课程数据var result=Mock.mock({ code: 200, msg: "操作成

2020-09-07 23:27:42 43

原创 VUE项目总结

VUE项目总结这个每时每课的项目,用了有一个星期左右来完成的,包括了页面的布局还有功能的实现整体来说,自己功能还是有点欠缺的,不完善的功能自己下去还有继续完善以下,现在就对这个项目进行总结。首先这个项目是一个在线教育的项目类型,主要做的还是在线视频回放生成的一些效果,包括了搜索,关注,收藏,刷题的功能,自己功能未完善的也就是刷题后的解析页面,做项目时问题是必不可免的,在这个项目中自己主要遇到的问题就是刷题后的提交刷题信息到服务器时会出现一个问题----参数传参不正确,因为在要求的参数中传递的是一个数组

2020-09-04 23:02:24 38

原创 js原型链的理解

原型链什么是原型链每个对象都可以有一个原型_proto_,这个原型还可以有它自己的原型,以此类推,形成一个原型链。查找特定属性的时候,我们先去这个对象里去找,如果没有的话就去它的原型对象里面去,如果还是没有的话再去向原型对象的原型对象里去寻找… 这个操作被委托在整个原型链上,这个就是我们说的原型链了接下来看一张图就会清晰一点一、prototype在JavaScript中,每个函数都有一个prototype属性,这个属性指向函数的原型对象。function Person(age) { t

2020-09-03 23:07:22 17

原创 闭包的理解

闭包其实我们可以这样理解,首先闭包是一个匿名函数,现在我们将它赋予了一个变量,那么他就有名字了,那么他每次执行完以后就有地方存了。但是每个变量存的地方又不一样,他们相互不关联,所以他们就是独立的个体了,所以a的值就不同了。就当是执行了不同的函数,只是恰好函数体是一样的罢了。优点:长期驻扎内存方便使用,可以隔离作用域,避免全局污染缺点:因为长期驻扎内存所以内存堆满了就会泄露出去特点:长期驻扎内存闭包的构成:闭包=函数+词法作用域(即以变量声明定义的位置为参照,如果当前位置没有定义,就会访问父级定义的

2020-09-02 23:24:21 90

原创 路由拦截,vuex数据持久化,vant样式穿透

路由拦截首先在定义路由的时候就需要多添加一个自定义字段requireAuth,用于判断该路由的访问是否需要登录。如果用户已经登录,则顺利进入路由,否则就进入登录页面。const routes = [ { path: '/', name: '/', component: Index }, { path: '/repository', name: 'repository', meta:

2020-09-01 23:26:56 45

原创 call apply bind , new的原理 ,防抖和节流

call appply bind:首先呢他们都是用来改变this指向的,但是他们也有区别区别:​ 1,传参不同:call通过“,”分隔的形式传递参数,前面是函数名​ 例:函数名.call(目标对象,参数一,参数二)​ apply参数使用数组进行传参​ 例:函数名.apply(目标对象,参数一,参数二)​ bind传参“,”分隔开,因为bind返回的是一个函数所以调用要加上括号​ 例:函数名.bind(目标对象,参数一,参数二)()​ 2,函数是否执行:首先呢c

2020-08-31 21:39:35 64

原创 vant进度条框架报错,百家云移动端h5点播SDK, 二维码分享

vant进度条框架报错错误信息:Invalid prop: type check failed for prop “percentage”. Expected Number,网上查找问题原因:1,因为vant进度条中的percentage是设置百分比的,所以他不可以大于100,把这个percentage这个设置为小于100的就可以了,我设了这种方法,但是貌似不太管用,所以我就去查了第二个方法2,因为没渲染你就获取数据,所以出现的报错,加上v-if就可以了 <van-progress v-if

2020-08-28 21:02:53 41

原创 vue项目切换用户头像的写法

vue项目切换用户头像的写法vue程序的头像的切换,今天别人给我讲了下我今天来试了一下还不错,进行总结首先是找清楚需要用的接口1,https://www.365msmk.com/api/app/public/img向服务器上传图片2,https://www.365msmk.com/api/app/user 把服务器图片上传到头像就这两个就行了接下来就是步骤的实现主要用到的其实是表单输入中的file<template> <div id="app"> <

2020-08-27 23:16:20 64

原创 vue组件递归

vue组件递归组件递归的话可以用来做一些后台管理系统的导航列表页面 可以用于多级导航的布局,十分简单首先是一个Tree组件的话tree.vue<template> <div> <div :style="indent"> {{title}} </div> </div></template><script>export default { name: "Tr

2020-08-26 21:06:22 71

原创 新建文本文档 (2)

put请求传递参数的方式今天项目中提交用户信息修改的时候调用了接口传递了接口但是接口返回错误信息,因为put的话,它的传参方式需要将参数设置为字符串的形式来进行传递,自己上网查了一下才解决使用put和delete请求,直接指定 ajax 请求中的 type 为 put/delete(不带 _method 参数),并且需要传递参数的时候data需要设置为json字符串var jsonstr = {"id":1,"name":"zsw"};$.ajax({ url:"/update",

2020-08-24 23:11:13 54

原创 vue项目问题

vue路由传值vue的路由传值有两种方式paramsthis.$router.push({ path:"/地址", params:{ 参数名:"参数值" }})接受this.$route.params."参数值"params的话传参刷新页面数据会消失不会保存querythis.$router.push({ path:"/地址", params:{ 参数名:"参数值" }})接受this.$route.query."参数值"query的话

2020-08-23 22:24:22 28

原创 vue的传值

vue的传值:1.父传子:在父组件的子组件标签上通过v-bind绑定要传递的数据,然后在子组件内部通过props接收// 父组件<select-list :dataList="dataArr" @parentReceive="changeVal"/> // 子组件props: ['dataList'] 123452.子传父:在子组件中定义一个方法,然后在方法里面通过this.emit进行传递(emit进行传递(emit进行传递(emit有两个参数(自定义事件名

2020-08-21 23:25:10 34

原创 vue全局过滤器,vue父组件如何向子组件传递布尔值,vue父组件调用子组件方法,setInterval

vue全局过滤器的使用首先是在src目录下新建filters文件,文件里面是index.jsexport function price(num){ if(num==0){ return num ="免费" }else{ var a = num/100 return a.toFixed(2) }}配置main.js文件//先引入import * as filters from './filters'//再配置Objec

2020-08-20 22:15:13 327

原创 vueaxios请求封装,vue过滤器和moment日期库的使用,vue组件传值,vue中利用组件方式使用SVG,vue中底部导航栏router-link样式的修改

axios请求接口封装首先是三个文件request.js,api.js和env.js文件request.js://引入axiosimport axios from "axios"//设置专属域名const vipUrl = "/api/app/"//设置公共域名const env = require("../http/env")const Url = env.default.prod.baseUrl//创建一个axios请求const service = axios.create({

2020-08-19 23:31:30 63 1

原创 vue框架的搭建

vue框架的搭建1,安装脚手架vue install -g @vue/cli注意:安装脚手架报错时,错误代码-4058可以用以下方法解决1,配置淘宝镜像npm config set registry https://registry.npm.taobao.org2,npm info underscore (如果上面配置正确这个命令会有字符串response)3,npm --registry https://registry.npm.taobao.org info underscore最后继

2020-08-18 21:21:11 30

原创 新建文本文档 (2)

webpack手动搭建环境1,什么是webpack本质上,,WebPack可以看做是模块打包机:它做的事情是,分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(Scss,TypeScript等),并将其打包为合适的格式以供浏览器使用。webpack的理念就是一切皆模块化,把一堆的css文件和js文件放在一个总的入口文件,通过require引入,剩下的事情webpack会处理,包括所有模块的前后依赖关系,打包、压缩、合并成一个js文件,公共代码抽离成一个js文件、某

2020-08-17 23:07:50 30

原创 微信小程序项目总结(微信小程序传参方法,微信小程序三级联动,项目总结)

小程序学习笔记1,微信小程序的传参方法// 或者在wx.js里用wx.navigateToxi//页面跳转传参wx.navigateTo({ url: '/pages/detail/detail?productId=12345'})如果传参的话参数不能是对象,如果需要传对象,可以将对象转成json字符串,然后拼接到url后面,在接收页面再将json字符串转成对象let info = { a:2, b:3}let infoStr = JSON.stringfy(info);wx.

2020-08-15 21:11:13 125

原创 JS学习笔记

微信小程序学习笔记1,简单介绍下 js这个是今天早上在在听面试题的时候遇到的 感觉听了听被面试者的回答 我感觉还不够好于是自己就在网上查了一下JavaScript一种直译式脚本语言是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。组成部分javascript组成一个完整的 JavaScript 实现是由以下

2020-08-15 00:23:24 66

原创 微信小程序学习笔记(动态绑定样式,双层循环item重名,页面跳转,async/await的再次学习)

微信小程序学习笔记1,微信小程序动态绑定style样式和class今天在做项目时遇到了一个关于切换导航 切换样式的问题,自己是想用style和class动态绑定来完成 但是自己一时又记不起来怎么写了 于是上网上 查了查资料 现在来进行总结首先是遍历导航按钮的每一项并赋予index第二步是通过点击导航按钮来更改保存在data中的selectIndex通过在标签中的class样式<button class="{{ index===currentIndex? 'active':'' }}" &gt

2020-08-13 23:32:49 121

原创 微信小程序学习总结(async,await)

微信小程序学习总结(async,await)1,async,await和promise首先是async和await,async和await是async和await两部分组成,async是异步的意思,而await是async wait的简写,所以async用于声名function是一个异步的,await用于等待异步方法执行async:async是加在一个function之前的,它的作用是将function变为异步的操作,而这个异步操作的返回值是一个promise对象 async f

2020-08-13 01:30:48 124

原创 微信小程序的登录(详细)

微信小程序的登录(详细)1,还是先从button按钮来开始实现的,button按钮弹框是一个组件,在组件中触发事件 <view class="xhy_btns" v-show={{isShow}}> <button type="primary" open-type="getUserInfo" bindgetuserinfo="getUserinfo">允许</button> <button type="default" catcht

2020-08-12 00:16:04 80

原创 微信小程序的登录注册 实现

微信小程序的登录注册 实现前提:本案例是配合API工场的后台接口实现的1,首先是给页面加上一个按钮或者弹出层 <button class="l" open-type="getUserInfo" bindgetuserinfo="processLogin">允许</button>2,利用点击按钮来获取用户的信息 processLogin(e) { //e就是用户的信息 //如果没有用户userInfo if (!e.detail.userInfo)

2020-08-10 23:08:02 273

空空如也

空空如也

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

TA关注的人 TA的粉丝

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