- 博客(39)
- 收藏
- 关注
RSS订阅
原创 白店小二的js知识——数组
数组1、join()，将数组转为字符串不改变原数组，需要赋值给另一个变量。括号里的字符串会附加在每个数组元素后。如果不加，默认为“,”。var fruits = ["Banana", "Orange", "Apple", "Mango"];var n=fruits.join(" and ");//Banana and Orange and Apple and Mango...
2020-08-06 09:16:02
163
1
原创 白店小二的js知识——字符串
1、split以某一特殊字符分割字符串如 “achk#lajkjd?adk#jijoj?cja#cjoo” var str = "achk#lajkjd?adk#jijoj?cja#cjoo"; var newstr = str.split("?"); console.log(newstr,"split以某一字符分割字符串");// ["achk#lajkjd", "adk#jijoj", "cja#cjoo"]split()函数不会改变原字符串，需要赋值给新的变量。2、repla
2020-07-29 13:55:07
136
1
原创 白店小二：Referer——浏览器返回信息
HTTP Referer是header的一部分，当浏览器向web服务器发送请求的时候， 一般会带上Referer，告诉服务器该网页是从哪个页面链接过来的， 服务器因此可以获得一些信息用于处理
2021-07-02 17:37:17
217
原创 白店小二：神奇的运算符“|=”
猛的一看以为是不等于!=，仔细看了看发现是或等于|=，这下更蒙了，|=是什么鬼？之前完全没见过。查了资料，看看写文章，发现是这么回事。 let a = 1; // 0001 a |= 2; // a = a|2 console.log(a); // 3a初值为1，转为二进制是0001。a|=2的意思就是a=a|2，就是让a与2做或运算。2转二进制是0010，与0001做或运算。00010010——0011结果就是0011，也就是3....
2020-11-25 17:06:05
659
原创 白店小二：Vant UI中Toast的特殊使用
问题：在使用Vant时，接口调用之后要给出成功或失败提示，我想着就用Toast做嘛，很简单。但Vant的Toast样式就让我很头疼，带有图标的Toast，图标是在上方，提示文字在下方的，而我想要的是二者在同一条直线上，我查了下文档发现，并没有能定义图标位置的属性，只有一个定义消息框方向的。如果仅仅只是调整一下方向也不是特别困难的事情，但Vant的Toast是独立在应用外的，就是它不在项目定义的APP下，它是和APP同级的，如图。这样就造成一个问题，没有办法修改Toast的样式了，因为要修改，就要去动
2020-11-18 13:42:11
3604
7
原创 白店小二：原生ajax
Ajax请求的五个步骤：创建实例；设置请求方法GET/POST/其他，URL请求路径，异步true同步false；设置请求头；接口传参；接口响应回调。 let ajax = new XMLHttpRequest(); // 创建实例 ajax.open("GET", 'url', true); // 请求方法GET/POST/其他，''URL请求路径，异步true同步false ajax.setRequestHeader("Content-type", "application/x-ww
2020-11-11 14:25:55
94
原创 白店小二：实现原生文件上传
<form ref="jsForm"> 上传<input type="file" :value="fileMsg" @change="getFromData($event)" /> <!-- change事件监听文件上传，event是此次事件操作，event.target.files，可以取到上传的文件数据 --> </form> getFromData (e) { let form = e.target.fi.
2020-11-05 09:18:00
108
原创 白店小二：函数的防抖与节流
举一个栗子：比如 今天 会有很多朋友来家里，每个朋友到门口，管家就按一下门铃，正常情况下，每听到一次门铃，我们就去开一次门，若是间隔时间较长，我们不会感觉到疲惫，若突然一小段时间，一个一个来了跟多朋友，这样我们就要在短时间内去多次开门，就会导致我们会非常累。这个例子就解释了，为什么我们要去做函数的防抖与节流，在上例中每按一次门铃就好比用户做一次操作，当用户在一段时间内连续的操作，就会导致我们（服务器）的压力过大，资源消耗严重。函数防抖：设置一个时间段，当上一次按下门铃的时间减去下一次按下门铃的时间大于设
2020-10-13 20:58:17
88
2
转载 白店小二的面试总结——闭包
闭包是指有权访问另一个函数作用域中的变量的函数，并且在闭包内部形成一个外部无法访问的局部作用域。创建闭包的常见方式是在一个函数内部创建另一个函数。通过另一个函数访问这个函数的局部变量,利用闭包可以突破作用链域，将函数内部的变量和方法传递到外部。闭包是一种机制函数要访问一个变量的时候，就会先从自己的作用域开始，逐步向外层函数的作用域寻找那个变量的值。简而言之就是外层函数不能访问内层，内层能访问外层。优点加强封装性,可以达到对变量的保护作用。缺点由于闭包内部变量优先级高于外部变量,所以多查找作
2020-09-25 09:26:14
69
原创 白店小二：你不知道的CSS小知识
我想让一个div盒子的宽度 = 100%宽度 - 100PX ；如果这样写CSS得到的结果一定是错误的，div的宽度也不会像这样改变。可能有人说用CSS的扩展呀，Less、Sass都可以做到。确实，使用这些扩展语言，可以做到在CSS里进行数据运算，但我要说的却是不使用这些扩展语言同样能做到的一种方法。.testCalc { background-color: #0ff000; width: calc(100% - 50px);}看上面的CSS代码里，我使用到了函数calc();在这里可以对
2020-09-15 09:34:26
65
转载 白店小二转载——Vue实现复制内容到剪贴板
原文：https://www.jianshu.com/p/2f2d0f0c67bb安装npm install --save vue-clipboard2引入（我一般在main.js引入，如果仅仅是某一小模块用到，在对应的component引入即可）import Vue from 'vue'import VueClipboard from 'vue-clipboard2' Vue.use(VueClipboard)使用// jslet message = '拷贝的文本';
2020-09-09 17:13:19
80
原创 白店小二：接口301、302了怎么办？
前后台交互，是目前主流的一种开发方式。在接口联调的过程中，难免会出现各种各样的问题。调接口出现问题的时候，首先去查看接口请求头信息，确定咱们前端请求信息没问题.接口Status Code报302Found了怎么办呢？再去查Response Headers里的信息有没有问题，接口重定向时，响应头会返回location，它的值表示重定向的URL地址，保证这个URL与想要的地址一致。...
2020-09-04 15:46:05
3149
原创 白店小二：上拉加载时的判断
(e.target.scrollHeight - (e.target.scrollTop + e.target.offsetHeight)) < 10当滚动条距离文档下方小于10时，让其执行滚动。这个判断可能有问题，因为是我写的，若是有不对的地方，希望大家指出哈。
2020-09-04 10:53:43
108
原创 白店小二：使用Vue开发项目时遇到的坑
<div class="test">{{test}}</div> data () { return { test: '', count: 0 } }, components: {}, mounted () { this.count = 2; this.getData(); this.count = 1; }, methods: { getData () { this.test
2020-09-04 09:20:38
98
原创 白店小二：管理项目时的错误——Uncaught ReferenceError: Vant is not defined
场景对项目新增加了一个UI框架Vant，按照官方文档进行安装和配置，官方文档推荐按需加载，于是我就做了按需加载的配置。babel.config.jsmodule.exports = { presets: [ '@vue/cli-plugin-babel/preset' ], plugins: [ ['import', { libraryName: 'vant', libraryDirectory: 'es', style: true .
2020-09-02 13:34:49
5736
6
原创 白店小二：判断一个数是否是整数
ES6新增的方法。let newNum = 101;let oldNum = 10.1;Number.isInteger(newNum); // true Number.isInteger(oldNum); // false
2020-08-31 18:18:02
85
原创 白店小二：decodeURIComponent对URL地址进行解码
对URL地址进行解码var test="http%3A%2F%2Fwww.w3school.com.cn%2FMy%20first%2F"document.write(decodeURIComponent(test1)); // http://www.w3school.com.cn/My first/
2020-08-31 10:26:57
137
原创 白店小二——生成数组的所有子集
在一些特殊情况下我们会想要得到某一个数组的所有子集，但是原生js里没有对应的方法，这就需要自己去进行处理了，如下面的函数就会返回一个数组的所有子集。allSubSets (arr) { let res = [[]] for (let i = 0; i < arr.length; i++) { const tempRes = res.map(subset => { const one = subset.concat([]); one.p
2020-08-31 10:11:01
296
原创 白店小二判断数组是否相等
判断两个数组是否相等若直接判断两个数组是否相等是无法判断的，需要将数组转化为字符串，再判断字符串是否相等，若数组的元素顺序不同，则还应先对数组进行排序，再转为字符串判断。let arr = [3,2,1];let oldArr = [1,2,3];arr.sort().toString() == oldArr.sort().toString()...
2020-08-31 10:04:19
100
原创 白店小二：关于Element UI的特殊使用
Element UI是目前最流行的桌面组件库之一，也是我使用的最多的一个web端的组件库，但是由于昨天帮助我朋友完成一项任务的时候，我发现我对于使用组件还是可以使用的，可还有些相对较深的问题解决起来还是需要查看文档才能解决，然后我就想把一些我认为比较需要牢记的一些问题的解决办法给写下来，让自己加深记忆。1、表格——对行的数据进行处理前端开发过程中，会遇到后台接口传参的字段结果是0/1，然后再让前端处理判断为是或者否；还有一种情况是要通过这些字段判断某个按钮是否要显示，这个时候就需要用到Element 中
2020-08-31 09:52:45
209
原创 白店小二：关于fiddler4的使用
fiddler是个抓包工具。抓取本机的一些包很容易，基本无需配置，对手机包的抓取是难点。使用fiddler抓取手机数据包百度搜索下载fiddler工具，进行安装。安装好之后，进行对手机的配置。1、打开WiFi。2、对目前连接的WiFi进行代理配置。将代理设为手动，将主机名称设为本机IP地址，端口号设为目前项目占用的端口号。 3、对项目进行配置，将项目的host地址设为本机IP地址。4、再将启动后的项目地址，如‘http://本机IP:8080/#/navigate’，使用二维码生成工具制作成
2020-08-29 17:24:56
144
原创 白店小二手搓井字棋
井字棋难度在于判断胜利条件，说起来容易三子连一线，就算获胜，但是实施起来很困难。我这里使用了一个较为取巧的办法：我将所有可能获胜的方式归总起来，存在一个数组里，再把下棋双方所下的每一步棋子都放置在一个数组中，然后对元素大于3的存棋数组进行子数组遍历，取出其中长度为3的子数组与获胜数组进行比较，若子数组在获胜数组里有出现，则判断胜利。效果图代码 <div id="button"> <div class="drag-test"> <div class="
2020-08-28 16:13:20
73
原创 白店小二：关于深拷贝与浅拷贝及实现方法
深拷贝与浅拷贝的区别就在于，修改原值时，拷贝的值是否会发生改变，改变了就是浅拷贝，不改变就是深拷贝。浅拷贝（shallowCopy）只是增加了一个指针指向已存在的内存地址。深拷贝（deepCopy）是增加了一个指针并且申请了一个新的内存，使这个增加的指针指向这个新的内存。深拷贝就像A的房子里有一样东西，B就去买了房子，也放进去了同样的东西，所以当A在房子里拿走或放入东西时，B的房子不会发生变化。浅拷贝就像A的房子里有一样东西，A把房子的地址告诉了B，所以当A在房子里拿走或放入东西时，B一去看也知道这
2020-08-28 10:50:19
150
原创 白店小二的js知识——基础
数据类型值类型(基本类型)：字符串（String）、数字(Number)、布尔(Boolean)、对空（Null）、未定义（Undefined）、Symbol。引用数据类型：对象(Object)、数组(Array)、函数(Function)。注：Symbol 是 ES6 引入了一种新的原始数据类型，表示独一无二的值。小知识基本数据类型存储在栈内存中，引用数据类型存储在堆内存中。null是基本数据类型，typeof出的却是Object，且null存储在栈内存中。定义变量3种定义方法：va
2020-08-28 10:07:42
130
原创 白店小二的Vue知识
阻止事件冒泡在click后添加stop可以阻止事件冒泡。<div @click="father"> <div @click.stop="son"></div></div>
2020-08-21 16:51:29
65
原创 白店小二手搓穿梭框
<div id="shuttle"> <header class="header"> {{headerMsg}} <span>{{programName}}</span> </header> <main class="main"> <div class="main-content"> <div v-if="choose">
2020-08-18 10:22:29
144
1
原创 白店小二使用flex布局
1、水平垂直居中display: flex;align-items: center; /* 交叉轴居中 */justify-content: center;/* 主轴居中 */
2020-08-14 17:04:32
79
原创 白店小二：关于异常处理
在try中书写代码，若有代码错误，try会抛出异常，catch则会将异常捕捉，这时便会转去执行catch中的代码。var txt="";function message(){ try { alert("Welcome guest!"); //adddlert("Welcome guest!"); } catch(err) { txt="本页有一个错误。\n\n"; txt+="错误描述：" + err.message + "\n\n"; txt+="点击确定继续。\n\n";
2020-08-13 09:54:54
80
原创 白店小二配置Eslint
{ // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation": false, // 重新设定tabsize "editor.tabSize": 2, // #每次保存的时候自动格式化 "editor.formatOnSave": true, // #每次保存的时候将代码按eslint格式进行修复 "eslint.autoFixOnSave": true, // 添加 vue 支持 "eslint.val
2020-08-12 17:20:46
103
原创 白店小二使用Vant UI
1、van-list里的offset属性用于设置滚动条与页面底部相隔的最小距离，用于上拉加载，默认最小距离是300。官方说明：滚动条与底部距离小于 offset 时触发load事件。
2020-08-12 17:19:59
536
原创 白店小二使用Git
1、上传本地代码到缓存git add .2、提交缓存，并写修改注释git commit -m '修改测试'3、提交代码到远程分支git push origin dev
2020-08-12 16:08:15
157
原创 白店小二发现运行项目错误
问题npm : 无法将“npm”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写，如果包括路径，请确保路径正确，然后再试一次。原因：先在VSCode里加入了工作区，已经读取了全局变量path，再下载的Node，这时Node将npm加入path，但由于VSCode已经读取了path，所以显示无法识别npm。解决办法：重启VSCode，即可解决。...
2020-08-11 17:20:51
85
原创 白店小二的面试总结——Vue里页面间传值
1、父子组件传值props父组件通过绑定变量对子组件传参<player class="playAudio" v-if="playMusicd == true" :changeMusic="orchangeMusic"></player> components: { //父组件里定义子组件，才能在父组件里使用子组件 player: player },子组件props: ["changeMusic"],//定义父组件的传参data() { ret
2020-08-06 09:19:29
165
原创 白店小二的面试总结——Vuex里怎么操作状态
（1）在state里定义状态const state = { songsList: [],//当前播放歌曲所在的歌单,存每个歌曲的id,存入前处理 recentSongs: [],//最近播放的歌曲}this.$store.state.list.songsList;//使用state里的数据，将其赋值给一个变量。（2）在mutations里更改state的状态像是事件注册，定义一个函数，当想要改变state的值时，调用 store.commit 方法，第一个参数为定义的函数名称，第
2020-08-06 09:18:39
89
原创 白店小二的面试总结——Vue里的watch和computed有什么区别
计算属性computed：1、支持缓存，只有依赖数据发生改变，才会重新进行计算。2.、不支持异步，当computed内有异步操作时无效，无法监听数据的变化。3、computed 属性值会默认走缓存，计算属性是基于它们的响应式依赖进行缓存的，也就是基于data中声明过或者父组件传递的props中的数据通过计算得到的值。4、如果一个属性是由其他属性计算而来的，这个属性依赖其他属性，是一个多对一或者一对一，一般用computed。5、如果computed属性属性值是函数，那么默认会走get方法；函数的返
2020-08-06 09:17:40
160
原创 白店小二的面试总结——解决浏览器跨域
1、解决浏览器跨域因为浏览器的同源策略，所以不同网站间不能互相访问数据，这是浏览器对JS作出的安全限制。同源：协议、域名、端口号都相同，只要有一个不相同，那么都是非同源。如：https://localhost:8080 https是协议，localhost是域名，8080是端口号。由于同源策略的限制：1、Cookie、LocalStorage 和 IndexDB 无法读取2、DOM 和 Js对象无法获得3、AJAX 请求不能发送注意：对于像 img、iframe、script 等标签的 s
2020-08-04 15:13:27
229
1
原创 白店小二的小程序知识
1、小程序默认宽750rpx。2、绑定事件<view class="container"> <button data-chuancan="只有这样才能传参，不能在事件后用括号传参" bindtap="dding"></button></view>`3、循环和条件的写法 <view wx:if="{{tof}}"> 必须要用双花括号包裹参数，不然就会识别成字符串 </view>循环当前项变量默认为item，修改
2020-07-28 14:42:42
208
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人