九州县令-优快云博客

1、js中的宏任务和微任务宏任务包括：setTimeout setInterval Ajax Dom事件微任务: promise async/await注意：微任务比宏任务的执行时间要早宏任务(macro)task，可以理解是每次执行栈执行的代码就是一个宏任务（包括每次从事件队列中获取一个事件回调并放到执行栈中执行）。浏览器为了能够使得JS内部(macro)task与DOM任务能够有序的执行，会在一个(macro)task执行结束后，在下一个(macro)task 执行开始前，对页面进行重新渲染

2022-05-27 21:11:36 823

原创 vue最新面试题

1、vue的生命周期以及页面初次加载会触发哪些钩子根组件实例：8个 (beforeCreate、created、beforeMount、mounted、beforeUpdate、updated、beforeDestroy、destroyed)组件实例：8个 (beforeCreate、created、beforeMount、mounted、beforeUpdate、updated、beforeDestroy、destroyed)全局路由钩子：2个 (beforeEach、afterEach)组件路由

2022-05-27 19:05:58 204

原创 MAC 下卸载 MySQL

终端下执行步骤一：切换到~cd ~步骤二：打开usr文件open /usr步骤三：找到local，进入到local文件夹，然后依次执行如下命令sudo rm /usr/local/mysqlsudo rm -rf /usr/local/mysql*sudo rm -rf /Library/StartupItems/MySQLCOMsudo rm -rf /Library/PreferencePanes/My*rm -rf ~/Library/PreferencePanes/My*sud

2021-12-13 20:02:05 896

原创 python-Flask编写API接口

首先这里是用的Flask框架来配置的接口如果未安装可以先安装flask框架 pip install flaskimport flask, jsonserver = flask.Flask(__name__)@server.route('/index',methods=['get', 'post'])def index(): data = {"name": "xiaomi", "time": "2012"} return json.dumps(data, ensure_ascii=False)

2021-08-20 15:50:46 1493

原创 uni-app获取通讯录信息获取手机号

<view class="index"> <button type="primary" @tap="getContacts" style="padding: 20rpx 0;">获取联系人</button> <block v-for="(item,index) in list" :key="index"> <view>{{item.displayName}}</view> <block v-for="

2021-03-08 15:55:40 1109

原创小程序自定义头部、底部以及全局登录弹窗、适配各种手机的自定义头部底部组件

相信大家在做小程序的时候有些需求用原生的头部和底部是达不到想要的效果的就需要自定义头部、底部以及全局的登录弹窗自定义头部底部需要设置app.json内把window下面的navigationStyle设置为“custom“然后在页面index.json内添加组件的路径在usingComponents下第一个为登录的组件，第二个为底部组件头部的组件路径可以写在每个页面下也可以写在全局app.json内<navigation-bar navbar-data='{{nvabarData

2020-09-21 11:08:55 679

原创微信小程序倒计时，小程序60秒倒计时，小程序倒计时防止重复点击

相信大家再做小程序的时候大部分都会碰到获取验证码功能比如说手机号登陆获取验证码一定时间之内不能重复点击html部分<view class="signIn"> <view class="mainBody"> <view class="title">手机号登录</view> <view class="weui-input"> <input bindinput="adminNameInput" type="

2020-07-31 10:23:08 1012 1

原创微信小程序嵌套h5页面，h5页面返回小程序，小程序和h5的页面和交互方法，h5点击分享小程序页面

相信大家在做小程序的时候有些需求会需要嵌套h5页面正常的h5页面嵌套很简单就是一个web-view然后放入h5链接就可以了 <web-view src="http://www.google.cn?id=1&type=2"/>如果当前的h5页面需要分享直接点击分享是不能调用微信小程序分享的但是可以点击后跳转到小程序页面从小程序的方法中调用分享wx.miniProgram.navigateTo({url: "/pages/index/sharePosition/index?id

2020-07-22 14:47:54 3657 3

原创 vue点击事件、vue阻止冒泡事件、 @click.stop、 v-on:click.stop、vue点击阻断、vue点击子集的方法不执行父级的方法

相信点击事件是在vue框架里面的一个常用的方法正常的点击事件为 v-on:click=“方法名(参数)”简写为@click=“方法名(参数)”有些情况下会出现父级元素有点击事件、子元素也有点击事件这样就会出现点击子元素会执行两次方法正常情况下点击列表的关闭按钮会删除元素但是它的父元素有点击添加样式的功能所以在点击列表删除按钮的时候会删除列表这个字段、但是会给第三个元素添加样式由于列表这个字段已经删除了、所以活给我的这个字段添加样式在这里我添加了alert方便大家区分#app{ widt

2020-07-15 14:39:51 2104

原创 vue axios接口封装、Promise封装、简单的axios方法封装、vue接口方法封装、vue post、get、patch、put方法封装

相信大家在做前后端数据交互的时候都会给请求做一些简单的封装就像之前封装ajax方法一样axios的封装也是一样的简单下面这个就是封装的axios的方法，require.jsimport axios from 'axios'axios.defaults.timeout = 5000axios.defaults.baseURL = '接口名称-共用部分'/** * 封装post请求 * @param url * @param data * @returns {Promise} */

2020-07-13 10:49:56 1238 1

原创 vue-router 报错、:Avoided redundant navigation to current location 错误、路由重复

在用vue-router 做单页应用的时候重复点击一个跳转的路由会出现报错这个报错是重复路由引起的只需在注册路由组建后使用下方重写路由就可以const originalReplace = VueRouter.prototype.replace;VueRouter.prototype.replace = function replace(location) { return originalReplace.call(this, location).catch(err => err);

2020-07-06 17:30:20 1466

原创微信小程序支付、小程序支付功能、小程序支付方法、微信小程序支付方法

相信大家在做小程序的时候不可避免的会碰到支付功能小程序的支付和pc的是有区别的小程序的支付方法为 wx.requestPaymentwx.requestPayment({ timeStamp: '', //时间戳，从 1970 年 1 月 1 日 00:00:00 至今的秒数，即当前的时间 nonceStr: '', //随机字符串，长度为32个字符以下 package: '', //统一下单接口返回的 prepay_id 参数值，提交格式如：prepay_id=*** signTyp

2020-06-30 17:35:13 489

原创微信小程序热更新，小程序提示版本更新，版本迭代，强制更新，微信小程序版本迭代

相信很多人在做小程序的时候都会有迭代每当版本迭代的时候之前老版本的一些方法或者显示就不够用了这就需要用到小程序的热更新、或者说是提示升级小程序版本editionUpdate:function(){ var self=this // 获取小程序更新机制兼容 if (wx.canIUse('getUpdateManager')) { const updateManager = wx.getUpdateManager() //1. 检查小程序是否有新版本发布

2020-06-24 09:48:10 2005 7

原创微信小程序动态修改title，动态配置title，动态配置头部，微信小程序动态配置头部

微信小程序的title是在json里面配置的 "navigationBarTitleText": "title名称"这种title是固定死的不灵活处理一些页面相同title不同的场景就不够用了这个时候就需要动态配置titlewx.setNavigationBarTitle({ title: "title名称"})这里为了方便可以在oLoad里面或者onSHow里面写这个方法这个的title可以掉接口传给你也可以在上一个页面url传参这个页面接收...

2020-06-23 17:19:09 1862

原创响应式布局rem、rem方法封装、移动端响应式布局

相信大家在做移动端的时候都会做各个手机的适配这种适配就是响应式布局在之前做网站的响应式从pc到手机用的是媒体查询@media screen and (max-width: 300px){} 最大宽度300像素需要的样式后面移动端业务兴起后做的响应式布局是基于手机各个型号以及各种分辨率的响应式这个时候用的就是rem布局，也是最简单的布局直接用rem写是不行的，这个时候就需要借助jsfunction fontRem() { var bodyWidth = document.getElem

2020-06-18 13:36:57 356

原创 jquery 选项卡切换、选项卡封装、简单的jquery选项卡封装、tab切换效果

相信选项卡切换是大家常用的效果单独写一个选项卡切换很方便但是要是一个页面出现多个选项卡不做封装的话会显得代码很杂乱<div class="bodyCenter"> <div class="nav"> <span class="on">新闻</span> <span>热点</span> <span>动态</span> </div>

2020-06-12 09:46:39 283

原创 js获取url并截取相应的字段，js解决url获取中文字段乱码问题

相信url截取信息是一个很常用的小功能页面跳转传参的时候可以在A页面的url挂一些参数到B页面获取正常的页面传参都是以数字和英文为主正常情况下中文获取的时候是有乱码的所谓上有政策下有对策一个正常的url（http://网址?areaInfo=13394186.192948427,3695040.8525992734&lines=1&nameId=7665&name=九州县令）平时写的url截取方法function qs (name) { var reg

2020-06-11 09:59:59 590 1

原创微信小程序接口封装、原生接口封装、request、promise封装

相信大家在做微信小程序的时候会有很多地方需要调用接口，就和pc以及手机端一样，多个页面多次调用会有很多状态，那为了节省大家的开发时间就会需要给请求的接口做一些简单封装，便于开发，在这里我用了两个js，一个js封装的是方法名，另外一个是接口名，统一管理下面这个是统一的接口方法封装const baseURL = "接口名";const request = params => { const token = wx.getStorageSync("token").token; return ne

2020-06-10 13:52:20 822

原创 node最简单的本地服务搭建

1、首先需要安装node node下载链接2、需要安装http的镜像文件npm install http-server -g有权限不够（一般指mac）可以添加 sudo npm install http-server -g 然后输入密码3、切换到需要执行的项目的文件夹 http-server 或者 http-server -p 8080指定端口最后在浏览器输入 http://127.0.0.1:8080/...

2020-06-08 10:45:08 263

原创 picker-view、微信小程序自定义时间选择器（非官方）

picker-view自定义时间选择器官网的自定义时间选择器比较简陋、日期不准下面是我自己写的一个demo<view class="baseList"> <view class="list clearfix"> <view class="fl listName"><text class="reqIcon">*</text> 参展时间</view> <view class="listMain fr" bi

2020-06-07 17:00:02 1029

原创微信小程序wx.switchTab跳转到tab页面后onLoad里面的方法不执行

相信大家在做小程序的时候启动页跳转到tab首页会用到switchTab但是在跳转后发现页面模块不全，后面console.log()后发现是onLoad里面的方法不执行解决这种问题的方法页有很多中，最简单的就是在启动页添加跳转成功的方法wx.switchTab({ url: '/pages/index/index', success: function (e) { var page = getCurrentPages().pop(); if (page == undefined

2020-06-05 17:02:01 3094 1

原创 css换行后缩进，css缩进技巧

一般情况下像下图这样需要缩进的，一般都会外面一个div里面两块需要两个div然后用定位或者flex、table、浮动后设置宽度等来实现已知宽度的情况下上面列的方法都适用不知宽度的情况下可以用flex、table等来实现<div class="main"> <div class="list">八卦：八卦，见于《周易·系辞下》云：“古者包牺氏之王天下也，仰则观象于天，俯则观法于地；观鸟兽之文与地之宜；近取诸身，远取诸物，于是始作八卦，以通神明之德，以类万物之情。” [1]

2020-05-28 15:46:22 4499 1

原创最新前端面试题-前端必备技能-前端技术汇总

一、css部分二、js部分三、vue部分四：其它

2020-05-28 15:44:37 843

原创小程序拨号功能，小程序点击按钮实现打电话功能

点击拨号是常用的功能，但是h5和小程序是有区别的h5很简单就是一个a链接电话号码小程序就多了几个步骤1、<view bindtap="callPhone" data-phone="{{userPhone}}">{{userPhone}}</view>2、userPhone: ‘手机号’,callPhone (e) {let mobile = e.currentTarget.dataset.phone; 获取data-phone的手机号wx.makePhoneCall(

2020-05-28 15:43:01 2821

原创小程序循环列表，点击展开收起/关闭效果

1、循环列表，点击展开，再次点击关闭html部分<view class="listMain"> <view class="list" wx:for="{{list}}" wx:key="index"> <view class="title">{{item.title}}</view> <view class="desc {{item.isShow ? 'show' : 'hide'}}">{{item.desc}}<

2020-05-28 15:41:20 5889 3