- 博客(31)
- 收藏
- 关注
RSS订阅转载 HTTP中GET和POST的区别，99%的人都理解错了。
GET和POST。GET和POST是HTTP请求的两种基本方式，要说它们的区别，接触过WEB开发的人都能说出一二。最直观的区别就是GET把参数包含在URL中，POST通过request body传递参数。你可能自己写过无数个GET和POST请求，或者已经看过很多权威网站总结出的他们的区别，你非常清楚知道什么时候该用什么。当你在面试中被问到这个问题，你的内心充满了自信和喜悦。你轻轻松松的给出了一个“标准答案”：GET在浏览器回退时是无害的，而POST会再次提交请求GET产生的URL地址可以被B
2021-03-11 10:31:53
204
1
原创 Vue3.0 多环境配置
Vue3的配置相比Vue2就简化了很多了。在根目录下新建.env.dev(开发环境)、.env.test(测试环境)、.env.prod(生产环境)文件，具体需要几个环境根据需要决定。.env+后缀叫啥都可以，自己高兴就好，当然最好也要让别人一目了然。.env.devNODE_ENV = ‘development’VUE_APP_MODE = ‘dev’VUE_APP_API_HOST = ‘本地开发api地址’其他的自己照搬，改改就好了注意：自定义变量要以VUE_APP开头哈修改
2021-03-03 09:50:10
1133
1
原创 前端里的几种常用的加密方式。
第一种就是base64格式的加密与解密：window.atob() 与window.btoa()可以实现对base64格式的数据进行解码和编码，其兼容性是主流浏览器，IE10及以上。window.atob(encodedStr)只可以解码用btoa方法编码的字符串。window.btoa()：将ascii字符串或二进制数据转换成一个base64编码过的字符串,但该方法不能直接作用于Unicode字符串<script> var str = 'RUNOOB' var
2021-03-02 18:43:41
1114
原创 初始Vue3.
一、知识点defineComponent 构建应用及绑定事件使用 reactive 绑定数据使用 ref ( torefs ) 绑定数据使用 getCurrentInstance 获取当前实例化对象上下文信息watch、watchEffect 数据监听简单的 TodoList 点餐功能1.使用 reactive 绑定数据<template> <div> <h1>使用 reactive 绑定数据</h1> <p>
2021-03-02 09:07:25
189
原创 Vue监听和深度监听watch。
watch可以让我们监控一个值的变化，从而做出相应的反应。 <div id="app"> 用户名：<input type="text" v-model='name'> <p>你的名字是：{{name}}</p> </div> <!-- 引入vue --> <script src="/node_modules/vue/dist/vue.js"></scri
2021-03-01 10:52:58
117
原创 Vue 商品排序，筛选
<template> <div> <div class="home-nav"> <!-- 导航 --> <van-tabs @change="onNavs"> <van-tab v-for="(item,index) in navs" :name="item.cid" :title="item.cname"></van-tab> </van-tabs>
2021-01-22 15:15:41
1176
1
原创 Vue 添加购物车并去重
从列表页添加到购物车并去重：addCart(val){ //添加购物车 let rel = true this.cart.map(item => { if (item.data.id == val.id) { item.num++ rel = false return } }) if(rel){ this.cart.push({ data:val, num:1
2021-01-22 15:14:25
226
原创 Vant 商品规格sku用法
Vant 商品规格sku用法<template><div> <!-- 基础用法 --> <div> <van-sku v-model="showBase" :sku="skuData.sku" :goods="skuData.goods_info" :goods-id="skuData.goods_id" :h
2021-01-22 15:02:20
1610
原创 Vue 跳转切换页面时左右滑动动画
1.给各个页面定义层级,在切换路由时判断用户是进入哪一层页面,如果用户进入更高层级那么做前进动画,如果用户退到低层级那么做后退动画import Vue from 'vue'import VueRouter from 'vue-router'Vue.use(VueRouter) const routes = [ { path: '/', name: 'search', meta:{index:0},//meta对象的index用来定义当前路由的层级,由小到大
2021-01-22 14:58:50
807
原创 解决H5页面左右滑动问题
在header里面加入禁止用户缩放<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1,minimum-scale=1,user-scalable=no">在代码模块最外面一层div 加上样式 style=“width:100%;overflow-x:hidden”
2021-01-22 14:57:15
1219
原创 Vue实现简单ToDolist案例
Vue实现简单ToDolist案例<template> <div> <div> <input type="text" v-model="inputValue" @keydown.enter="add"> <span @click="shaix" style="cursor: pointer;">筛选</span> <h3>正在进行({{noList}})</h3&
2021-01-22 14:56:12
136
原创 Vue实现导航切换
Vue实现导航切换：<template> <div> <div class="dbox"> <span @click="go('/')" :class="{'active':isActive=='/'}">指令</span> <span @click="go('/demo')" :class="{'active':isActive=='/demo'}">事件</span> <
2021-01-22 14:55:09
549
原创 Vue 实现商品分类、列表、详情、购物车、搜索（vant）
商品分类Classify：<template> <div> <div style="display: flex;"> <div class="oneNav"> <!-- vant侧边导航 --> <van-sidebar style="height: 617px; white-space: nowrap; overflow-y: scroll;" v-model="activeKey">
2021-01-22 14:53:15
7184
1
原创 Vue使用过滤器将时间戳转换成“发表时间+多久之前”
// 定义全局过滤器，如果时间戳是10位就乘以1000，如果是13位就不乘Vue.filter('filterTime',(oldTiem)=>{ let date = new Date(parseInt(oldTiem) * 1000); let nowTime = new Date let nowDate = nowTime.getDate() let time = "上午" if (date.getHours() > 12) { time = "下午" }
2021-01-22 14:50:07
280
原创 JS统计一个字符串中出现次数最多的字符。
话不多说 直接上代码：//统计一个字符串中出现次数最多的字符。 var str='sadasdavasdasdasdasf'; var o={}; for(var i=0; l=str.length; i<l;i++){ //var char=str[i]; var char =str.Chart(i); if(o[char]){//char就是对象o的一个属性，o[char]是属性值，o[char]控制出现的次数 o[char]++;//出现一次 次数+1 } e
2021-01-21 16:17:20
149
原创 BFC
CSS布局中的BFC问题面试题–边距重叠什么是边距重叠？什么情况下会发生边距重叠？如何解决边距重叠？边距重叠：两个box都设置了边距，那么在垂直方向上，两个box的边距会发生重叠，以绝对值大的那个为最终结果显示在页面上。有两种边距重叠的情况1.父子关系的重叠父子关系，如果子元素设置了外边距，在没有把父元素变成BFC的情况下，父元素也会产生外边距给父元素添加 overflow：hidden这样父元素就变为 BFC，不会随子元素产生外边距<style>.out
2021-01-18 17:12:26
702
2
原创 CSS盒模型
什么是盒模型？在HTML页面中，每一个元素都可以看做事一个盒子；而这个盒模型由：内容区（content）、填充区（padding）、边框区（border）、外边界区（margin）四部分组成。盒模型有哪两种？标准模式下：一个块的总宽度（页面中占的宽度）=width+margin（左右）+padding（左右）+border（左右）怪异模式下：一个块的总宽度=width+margin（左右）（width已经包含了padding和padding值）标准和怪异模型的转换box-sizing:cont
2021-01-18 16:58:06
103
原创 Vue项目优化.
代码优化1.使用keep-alive缓存不活动的组件实例。keel-alive是一个抽象组件：它自身不会渲染一个DOM元素，也不会出现在父组件链中；使用keep-alive包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。在动态组件...
2021-01-15 19:46:13
132
原创 函数防抖、节流
函数的节流和防抖：函数防抖和函数节流：优化高频率执行js代码的一种手段，js中的一些事件如浏览器的resize、scroll，鼠标的mousemove、mouseover，input输入框的keypress等事件在触发时，会不断地调用绑定在事件上的回调函数，极大地浪费资源，降低前端性能。为了优化体验，需要对这类事件进行调用次数的限制。函数防抖（debounce）函数防抖，就是指触发事件后在 n 秒内函数只能执行一次，如果在 n 秒内又触发了事件，则会重新计算函数执行时间。简单的说，当一个动作连续
2021-01-14 16:57:09
98
1
原创 Vue-router 路由守卫的基本用法
导航守卫其实也是路由守卫，也可以是路由拦截，我们可以通过路由拦截，来判断用户是否登录，该页面用户是否有权限浏览，需要结合meta来实现vue中路由守卫一共有三种：全局路由守卫，组件内路由守卫，路由独享守卫所谓的路由守卫可以简单的理解为一座房子的门口的保安，想要进入这个房子就必须通过保安的检查，要告诉路由守卫你从哪里来？总不能随便陌生人就给放进去？要到哪里去？然后保安再告诉你下一步该怎么做？如果你的确是这个房子主人允许进入的人，那就让你进入，否则就要打电话给房子主人，跟房主商量(登录注册)，给你
2021-01-14 11:13:52
286
原创 Vue自定义指令的概念及使用。
Vue自定义指令：directive在Vue中，除了默认设置的核心指令（v-model和v-show）,Vue也允许自定义指令directive.自定义指令分为全局自定义指令和局部自定义指令。全局自定义指令：使用Vue.directive来全局注册指令。Vue.directive('focus', { // 当绑定元素插入到 DOM 中。 inserted: function (el) { // 聚焦元素 el.focus() } })局部自定义指令：在
2021-01-13 11:38:07
160
原创 Promise封装axios请求（axios封装与API接口管理）
一、前言axios的封装与api接口的统一管理，其主要目的就是在帮助我们简化代码和利于后期的维护更新。在Vue项目中，和后台交互数据这块，我们通常使用的是axios库，所谓axios它是基于promise的http库，可运行在浏览器端和node.js中。它有很多优秀的特性，例如拦截请求和响应、取消请求、转换json、客户端防御XSRF等。所以我们的尤大大也是果断放弃了对其官方库vue-resource的维护，直接推荐我们使用axios库。二、axios封装步骤安装axios npm i
2021-01-12 11:10:06
632
原创 Vue双向数据绑定原理
Vue双向数据绑定原理使用Vue双向数据绑定首先我们要了解它的原理：Vue.js则是采用数据劫持结合发布-订阅模式的方式，通过Object.defineProperty()来劫持各个属性的setter、getter，在数据发生变动时发布消息给订阅者，触发相应的监听回调来渲染视图。实现步骤实现一个数据监听器Observer，能够对数据对象的所有属性进行监听，如有变动可拿到最新值并通知订阅者实现一个指令解析器Compile，对每个元素节点的指令进行扫描和解析，根据指令模板替换数据，以及绑定相应的
2021-01-08 14:43:54
127
原创 Vue之自定义组件。
简介组件系统是Vue.js其中一个重要的概念，它提供了一种抽象，让我们可以使用独立可复用的小组件来构建大型应用，任意类型的应用界面都可以抽象为一个组件树功能组件 (Component) 是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素，封装可重用的代码。在较高层面上，组件是自定义元素，Vue.js 的编译器为它添加特殊功能。在有些情况下，组件也可以表现为用 is 特性进行了扩展的原生 HTML 元素。所有的 Vue 组件同时也都是 Vue 的实例，所以可接受相同的选项对象 (除了一些根
2021-01-07 20:41:08
274
原创 Vue+Vant ui实现图片上传
Vue+Vant ui实现图片上传一、首先需要安装Vant uinpm i vant -S二、在main.js中引入Vant ui//引入Vantimport Vant from "vant";import "vant/lib/index.css"Vue.use(Vant)三、具体使用Vant Uploader组件详解<div> <p>图片上传</p> <van-uploader v-model="fileList" :after-re
2021-01-05 19:15:55
526
1
原创 浅谈Vuex。
1.什么是Vuex？Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。2.Vuex组成结构示意图：vuex的特点是把数据单独隔离，形成一棵树状图。单独隔离就意味着它有自己的生态系统。输入和输出，其中action作为数据的输入，state作为数据的输出。如下图：3.Vuex的核心概念：1. Storevuex中最关键的就是store对象，这是Vuex的核心。可以说，Vuex这个插件其实就
2021-01-04 14:52:36
158
原创 微信小程序入门详解。
小程序简介:小程序是一种全新的连接用户与服务的方式，它可以在微信内被便捷地获取和传播，同时具有出色的使用体验微信发布了一款自己研发的小程序开发工具：微信Web开发者工具下载地址：微信小程序官网集合了开发，预览，发布为一体的开发工具。一切准备就绪；首先呢，展示并介绍一下小程序开发的文件目录结构：pages：项目开发目录 相当于vue脚手架中的src目录。utils：存放封装的工具函数的目录。app.js：小程序的入口js文件 相当于vue中的main.js 通过App({})构造器
2020-12-24 15:32:48
170
原创 微信小程序生命周期钩子函数。
小程序生命周期：生命周期是指一个小程序从创建到销毁的一系列过程小程序的两种生命周期在小程序中 ，通过App()来注册一个小程序 ，通过Page()来注册一个页面小程序应用的生命周期：App()函数用来注册一个小程序。接受一个 Object参数，其指定小程序的生命周期回调等。App() 必须在 app.js 中调用，必须调用且只能调用一次。App({ onLaunch: function(options) { // 监听小程序初始化。 //小程序初始化完成时（全局只
2020-12-24 14:50:17
832
1
原创 Git如何使用？
Git如何使用？一、在使用git之前首先要了解Git和GitHub。git是一种分布式的版本管理系统，是任何软件开发项目中的重要内容，它主要用来备份代码和版本控制。它是Linux的创造者Linus研发的。GitHub是基于git的代码库托管站，也算是程序员的SMS（以码会友），其中一个主要的开源代码发布或托管站git的作用就是对文件进行版本管理，方便在不同版本进行切换修改，类似文件分不同时间备份让后需要时找回其中一份代替，不过更方便使用。GitHub某种程度上就是代码的网盘，也有开源开发商作为代码发布
2020-12-16 07:47:32
154
原创 普通函数和箭头函数的区别。
普通函数和箭头函数的区别一、写法不同箭头函数：let fun = () => { console.log('lalalala');}普通函数：function fun() { console.log('lalla');}二、普通的函数与箭头函数的this指向不同普通函数的this指向的是调用它的对象，而箭头函数不会绑定this，会捕捉其父类的上下文，作为自己的参数，如下：var obj = { a: 10,//箭头函数 b: () => {
2020-12-15 20:38:06
504
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人