- 博客(60)
- 资源 (2)
- 收藏
- 关注
RSS订阅原创 原型链，函数与对象关系
原型链function Person(){this.name="ceshi"}// 例1Person.__proto__===Function.prototype // truePerson.__proto__===Person.constructor.prototype // truePerson.constructor === Function // true// 例2Person.prototype.__proto__===Object.prototype //true// 例3P
2023-03-28 16:19:36
173
原创 小程序事件，冒泡，互斥，捕获
冒泡事件类型触发条件touchstart手指触摸动作开始touchmove手指触摸后移动touchcancel手指触摸动作被打断，如来电提醒，弹窗touchend手指触摸动作结束longpress手指触摸后，超过350ms再离开，如果指定了事件回调函数并触发了这个事件，tap事件将不被触发tap手指触摸后马上离开transitionend会在 WXSS transition 或 wx.createAnimation 动画结束后触发
2022-06-15 15:08:23
553
原创 webpack优化的几个方向
1. 减小代码体积比如css压缩，js代码压缩，删除注释2. 图片资源压缩url-loader可以指定将小文件转换为base643. 文件缓存 hashconst HtmlWebpackPlugin = require('html-webpack-plugin'); module.exports = {- entry: './index.js',+ entry: {+ main: './index.js',+ }, output: {-
2021-09-07 15:08:40
224
1
原创 node 基础服务器搭建 http模块 url模块
首先我们规划三个文件入口文件index.js服务http.js处理请求handler.jsindex.js 入口点文件var serve = require('./serve/http');const {handler} = require('./serve/handler');serve.start(handler);http.js 主要是搭建服务，设置请求头等const http = require("http");const url = require("url.
2021-09-07 14:32:17
191
原创 node path模块常用方法
var path = require('path');/** * ./ 指向当前的工作路径 * __dirname 指向被执行 js 文件的绝对路径 *//** * 获取url的最后一级 * @param {*} url * @param {*} suffix 需要忽略的后缀 * @returns */const lastPath = (url,suffix) => { if (suffix) { return path.basename(url,suffix
2021-09-07 11:10:05
182
原创 node fs模块的prmoise方式的常用方法
node同步与异步方式请参考下面的博客node fs同步异步的方法prmose Api会提示时实验阶段，但不影响我们使用var fs = require('fs').promises;// 读取文件const getFile = (url, chart="utf-8") => { return fs.readFile(url, chart);}module.exports.getFile = getFile;// 写入文件const setFile = (url, d.
2021-09-07 11:06:29
250
原创 node fs模块 读写文件常用方法
var fs = require("fs");// 异步读取文件const getFileAsync = (url, chart = "utf-8") => { fs.readFile(url, chart, function (err, data) { if (err) { throw Error("读取文件异常" + err); } console.log(data); });};module.exports.getFileAsync = ge
2021-09-07 10:57:54
250
原创 npm脚本 scripts与node process
一、 npm部分1. npm 脚本npm 允许在package.json文件里面，使用scripts字段定义脚本命令。如下它的每一个属性，对应一段脚本。比如，build命令对应的脚本是node build.jsnpm run build 等同于执行 node build.js当前目录的node_modules/.bin子目录里面的所有脚本，都可以直接用脚本名调用，而不必加上路径{ // ... "scripts": { "build": "node build.js" }
2021-09-06 16:23:46
440
原创 常用的数据验证封装 返回promise可扩展
// 常用正则const isPhone = /^1[3|4|5|6|7|8|9][0-9]\d{8}$/; // 手机号验证const isEmial = /\w[-\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\.)+[A-Za-z]{2,14}/; // 邮箱const isChinese = /^[\u4E00-\u9FA5\uf900-\ufa2d]$/; // 汉字const isBanking = /^[1-9]\d{9,29}$/; // 银行卡号...
2021-08-24 19:02:54
129
原创 js 对象（Object）方法总结
1. create创建一个对象const obj = Object.create({a:1}, {b: {value: 2}})第一个参数为对象，对象为函数调用之后返回新对象的原型对象，第二个参数为对象本身的实例方法（默认不能修改,不能枚举）obj.__proto__.a === 1 // true obj.b = 3;console.log(obj.b) // 2//创建一个可写的,可枚举的,可配置的属性pobj2 = Object.create({}, {
2021-08-24 11:10:46
2170
1
原创 小程序 获取组件实例与wxs获取时间
获取组件实例组件id属性赋值，比如user操作组件实例之前需判断，有可能你操作的时候，实例还没有生成。比如this.selectComponent(’#user’) && this.selectComponent(’#user’).getData(this.data.id)wxs获取时间这里与js不同，需要调用getDate<wxs module="tools">var times = function (val) { if (!val) return "
2021-03-25 11:31:07
405
原创 企业微信登录流程图
流程图开发环境模拟登录，是后端在浏览器写入cookie，请求时携带cookie，不重定向，直接登录成功。生产环境是第一次请求接口拿到重定向地址，需要重定向然后请求接口。
2021-03-11 16:04:21
1010
原创 企业微信sdk调用流程
企业微信JS-SDK 流程图企业微信JS-SDK使用创建需要调用企业微信的api列表所有js接口列表https://work.weixin.qq.com/api/doc/90001/90144/90540const jsApiList = [ "hideMenuItems", // 批量隐藏功能按钮 "showMenuItems", // 批量显示功能按钮 "hideAllNonBaseMenuItem", // 隐藏所有非基础
2021-03-11 15:44:04
2008
1
原创 webpack4 搭建vue项目，从头开始踩坑记
webpack搭建项目流程和全部过程以及踩坑记一 初始化项目进入目录 npm init -y生成默认的package.json二 搭建开发服务，安装webpack，webpack-cli,webpack-dev-server这里面有坑，版本之间兼容问题，我试的webpack5和webpack-dev-server3是不兼容的如下是我安装的版本："webpack": "^4.44.2","webpack-cli": "^3.3.12","webpack-dev-server": "^.
2020-12-25 15:48:29
268
1
原创 js 预编译 GO与AO 变量和函数声明提升
预编译预编译分为全局（GO）预编译和局部（AO）预编译，全局预编译发生在页面加载完成时执行，而局部预编译发生在函数执行的前一刻。js运行三步曲首先JavaScript的执行过程会先扫描一下整体语法语句，如果存在逻辑错误或者语法错误，那么直接报错，程序停止执行，没有错误的话，开始从上到下解释一行执行一行。1 语法分析2 预编译3 解释执行局部预编译（AO）的4个步骤在执行的前一刻会创建一个ao对象将函数内所有的形参和变量声明储存到ao对象中，value为undefined；将形参和实
2020-12-23 11:45:19
566
原创 js 新手常用小技巧 简写语法总结归纳
变量简写var a ;var b=8;var c;//等价于var a, b=8, c;对象属性简写当对象的属性与值是同一个值时let obj ={a:a,b:b}// 等价于let obj = {a,b}拓展运算符let a = [1,2,3];let b = [4,5,6];//如果说a,b合并，ES5的方法必然是使用a.concat(b),如果使用...不是更好吗？let c = [1,2,3,...b]//还有就是如果两个对象之间相互复制，使用拓展运算符就
2020-12-23 11:14:46
286
2
原创 js浏览器端 代码执行顺序 事件循环Event Loop 宏任务与微任务
js -> 单线程单线程我们可以理解为：就是js代码在执行过程中，后面的代码想要执行就必须等当前代码执行完成后才可以进行。同步任务与异步任务先执行同步任务，再执行异步任务。同步任务指的是，在主线程上排队执行的任务，只有前一个任务执行完毕，才能执行后一个任务；异步任务指的是，不进入主线程、而进入"任务队列"（task queue）的任务，只有"任务队列"通知主线程，某个异步任务可以执行了，该任务才会进入主线程执行。宏任务与微任务异步任务又分为了宏任务与微任务；其重要作用是为了增加代码执
2020-12-22 17:18:51
147
1
原创 NProgress 页面加载进度条插件
本文示例是在vue中展示首先安装nprogressnpm nprogress -S然后在路由的全局钩子函数中配置很简单，一会就实现了import { createRouter, createWebHistory } from "vue-router";import NProgress from "nprogress";import "nprogress/nprogress.css";import Routes from "./routers";const router = cre.
2020-12-21 18:30:25
170
原创 vue3 新特性总结
Vue2 到 Vue3 最直观的改变就是 Composition API——几乎所有的 Vue2 options 方法都被放到了 setup 函数里。就是从基于对象的编程（OOP）转向了函数式编程（FP）。创建方式首先创建方式发生了改变import { createApp } from "vue"; createApp(App)Teleport可以改变它包含的html渲染的节点位置，例如：下边的div将会渲染到body下边<teleport to="body"> <.
2020-12-21 18:08:22
387
2
原创 vue路由懒加载之分包 分模块加载
路由懒加载 分包如下代码，Home无任何处理，直接引入Ceshi 运用官方推荐的路由懒加载，优化首页加载的时间About在路由懒加载的基础上，进行了分包，webpackChunkName: “name”，注意该注释，name一样的会被打包在一起。注释不可省略。只有在跳到该路由的时候，才会加载import { createRouter, createWebHistory, RouteRecordRaw } from "vue-router";import Home from "../views
2020-12-21 15:29:32
2342
原创 详解js数据类型之深浅拷贝
数据类型undefined ---------- 未定义 Undefinedboolean ------------ 布尔值 Booleanstring -------------- 字符串 Stringnumber ------------ 数值类型 Numberobject ------------- 对象 Objectnull --------------- 空 Nullsymbol ------------ Symbol es6新增的深浅拷贝js数据类型分为基本数据类型
2020-12-21 15:12:30
184
原创 小程序ios真机 z-index 问题
在小程序开发工具中，z-index层级设置展示是正常的，但是在ios真机中回出现问题。层级设置在同一个view父集之下，那么展示就是正常的层级设置在不同view父集之下，那么开发工具展示是正常的，ios真机有问题android 展示一切正常所以为了兼容，利用z-index设置层级时，得在同一个父集元素之下...
2020-12-18 15:02:04
1197
原创 vue插槽 slot与slot-scope v-slot
插槽插槽，也就是slot，是组件的一块HTML模板，这块模板显示不显示、以及怎样显示由父组件来决定。单个插槽 | 默认插槽 | 匿名插槽 首先是单个插槽，单个插槽是vue的官方叫法，但是其实也可以叫它默认插槽，或者与具名插槽相对，我们可以叫它匿名插槽。因为它不用设置name属性。父组件<template> <div class="father"> <h3>这里是父组件</h3> <child>
2020-11-04 18:09:04
637
原创 微信小程序实现锚点功能
只需要在小程序触发标签绑定data-id, 目标标签绑定id// 锚点跳转 scrollView: function (event) { var me = this; var query = wx.createSelectorQuery().in(me); var id = event.currentTarget.dataset.id;//需要锚点点id query.selectViewport().scrollOffset() //#comm 跳转到指定i
2020-10-26 16:37:39
2113
原创 改变this指向 bind,apply,call三者区别与用法 arguments
apply、call call 和 apply 都是为了改变某个函数运行时的上下文（context）而存在的，换句话说，就是为了改变函数体内部 this 的指向。var func = function(arg1, arg2) { };func.call(this, arg1, arg2);func.apply(this, [arg1, arg2])其中 this 是你想指定的上下文，他可以是任何一个 JavaScript 对象(JavaScript 中一切皆对象)...
2020-10-26 16:32:41
307
原创 js和vue 防抖（debounce）、节流（throttle）
防抖（debounce）： 当持续触发某事件时，一定时间间隔内没有再触发事件时，事件处理函数才会执行一次，如果设定的时间间隔到来之前，又一次触发了事件，就重新开始延时。js实现：/** * 函数防抖 */function debounce(fn, delay) { // 记录上一次的延时器 var timer = null; var delay = delay || 200; return function() { var args = argume...
2020-09-14 11:13:50
798
原创 vue混入mixins 理解
vue混入 混入 (mixin) 提供了一种非常灵活的方式，来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被“混合”进入该组件本身的选项。个人理解：vue混入主要是提取公用的js，减少不必要的代码，对相同代码的封装。注意点：混入对象的内容必须是一个对象。 当使用混入时，相同的内容都会合并。 数据对象如果有相同的，则以被混入的对象中data数据为准。 一旦使用全局混入对象，将会影响到 所有 之后创建的...
2020-09-14 10:57:15
236
原创 jVectorMap 地图根据经纬度标点 足迹图，分布图
根据经纬度地图标点jVectorMap$('#map').vectorMap({ // 此处更改地图 map: 'cn_merc_en', // 中国地图 //map: 'us_aea', // 美国地图 //map: 'world_mill', // 世界地图 // backgroundColor: 'transparent', backgroundColor:'rgba(255,255,255,0)'
2020-06-09 16:19:18
625
原创 vant 下拉刷新与上拉加载一起使用的问题 下拉刷新触发两次 list与pull
//下拉刷新 onRefresh() { this.list = []; this.curPage = 1; this.finished = true; this.getData(); },getData() { this.isLoading = false; getList({ .
2020-06-09 11:30:44
4101
3
原创 vue 页面刷新 vuex状态消失问题
handleStore() {//刷新时将vuex的值保存在sessionStorage,刷新完成读取出来 let STORE_KEY = "STORE" if (sessionStorage.getItem(STORE_KEY)) { this.$store.replaceState(Obj...
2020-04-13 21:21:35
594
原创 vue-cli 配置环境测试环境
文件需要建在项目根目录.env .env.test.env文件NODE_ENV = 'production'VUE_APP_FLAG = 'pro'.env.test文件NODE_ENV = 'production'VUE_APP_FLAG = 'test'outputDir = testpackage.json文件"scripts": { "serve":...
2020-04-13 21:17:11
302
1
原创 pxtorem插件配置
在vuecli 项目根目录 新建postcss.config.jsmodule.exports = { plugins: { 'autoprefixer': { overrideBrowserslist: [ 'Android 4.1', 'iOS 7.1', ...
2020-04-13 21:11:18
4981
原创 小程序tabbar和位置权限
"permission": { "scope.userLocation": { "desc": "位置信息将用于小程序打卡" } }, "tabBar": { "color":"#333333", "selectedColor":"#199ED8", "list": [ { "pagePath": "pag...
2020-04-13 20:50:04
587
原创 小程序button按钮样式及授权
小程序button按钮狂傲样式，在wxss中无效果，可以在style重写样式<button open-type="getUserInfo" bindgetuserinfo="callUser" style="width:80%;line-height:88rpx;height:88rpx;padding:0" class="btn" >授权登录</button>o...
2020-04-13 20:47:02
727
原创 vue transition动画 fixed定位初始化错乱
vue组件切换动画但fixed定位会导致页面初始化错乱一下，有解决办法欢迎交流<transition :name="$store.state.global.EXCESSIVE"> <router-view/> </transition>.slide-right-enter-active, ....
2020-04-05 17:48:16
2176
5
原创 vant list 组件总结
list组件注意事项1 接口调用失败，会循环调用接口，解决办法加载失败需要处理2 list请求一次要一满屏，不然会接着调用3 接口请求反回停止的条件 1》加载失败 2》数据加载完成，再没有了 3》调用一次数据铺满全屏 isLoading: false, //下拉刷新 listLoading: false,//list加载 finis...
2020-04-05 17:42:29
1788
3
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人