自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(29)
  • 收藏
  • 关注

原创 ** PC端完美兼容各种分辨率的简便方法 **

PC端兼容各种分辨率的简便方法小程序、前端交流群:609690978PS:此方法需使用到less或者scss的@变量来支持以设计图 1920 宽度为例:css中存在一种叫vw的单位,是针对浏览器宽度为基础的百分比单位,与%的区别在于,子元素%是相对于父级元素的宽度来计算的,而vw则是针对浏览器的宽度来计算的。打个比方,浏览器宽度为1920px,父级元素宽度为100px,子元素宽度写50%则...

2019-10-28 18:55:12 4316 3

原创 **微信小程序之登录后返回登录前的页面(带参数)**

在实际开发过程中,由于接口的各种限制条件,比如下单操作,就需要用户进行登录才能进行调用,然而在用户登录之后再返回之前的页面怎么操作呢?思路是:首先,我要知道用户之前在哪个页面进行操作。其次,我们需要获取到这个页面的路由。最后,再登录后返回该路由。但是有时候,这些页面也是携带了参数的,需要登录之后带参数返回(其实说白了,就类似于一个完整的url,只是小程序中没有ip+端口号,直接就是路径+参数,要全...

2019-05-31 14:18:45 8981

原创 uni-app下,页面跳转后wacth持续监听的问题处理

uni-app解决页面跳转后watch持续监听的问题

2023-11-17 16:46:27 1412 1

原创 VUE使用webWorker处理万级数据

VUE使用webWorker处理万级数据接到一个查询全国银行数据的需求,总数据达到10兆,超过10万条数据。首先调用接口时势必会导致浏览器严重卡顿,其次在把这十万条数据渲染到页面上时,操作也会十分卡顿,所以我们要对此进行相关处理和优化用到的插件1.VUE基于webWorker的插件:VueWorker,npm install vue-worker --save2.虚拟DOM渲染插件:VueVirtualScroller,主要是只渲染可视范围内的dom,以达到渲染不卡顿的目的,npm install

2022-01-16 02:52:05 3213 2

原创 小程序基于雪碧图实现3d(横向全预览) ----组件

小程序、前端交流群:609690978先上效果图:准备条件:雪碧图,规格:单图尺寸343*375,帧数45帧(如图)上代码:wxml<wxs src="./animate.wxs" module="wxsFun" /><view class="{{ loadEnd ? 'active' : ''}}"> <image src="{{ value }}" class="slideImg" mode="heightFix" bindload="handl

2021-04-14 18:32:16 1097

原创 **input=file上传文件用div替换上传按钮及获取文件信息**

小程序、前端交流群:609690978<div class="box"> <div class="blank">{{ fileName }}</div> <div class="uploadBtn" @click="choiceFile">点击上传</div> <input id="file" ref="file" type="file" name="file" @change="getFile()"/></d

2021-04-08 15:59:55 464

原创 **ESLint + Prettier + VSCode自动校验/修复Eslint语法规则**

小程序、前端交流群:609690978写在前面: 本教程为有一定代码规范的开发者提供。如果您是新手,建议严格按照规范矫正自己的代码风格。尽量在没有ESLint的情况下也能写出漂亮规范的代码您是否还在为ESLint的语法校验规则而头疼?您是否还饱受ESLint的语法规则的折磨?您是否还在手动修改ESLint的错误?别着急,这篇文章将彻底让你告别ESLint所带来的各种困扰。(视频以Vue-js录制,适用于anglar中的ts)先上效果:

2021-01-15 18:18:58 1176 4

原创 vue 返回顶部动画效果

vue 返回顶部动画效果小程序、前端交流群:609690978 methods: { // 监听页面滚动 scrollToTop() { const scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop this.showTopTimer && clearTimeout(this.showTopTimer)

2020-09-25 19:44:35 1199

原创 js 数组元素排序

js 数组元素排序// 排序 compare(value1, value2) { if (value1 < value2) { return -1 } else if (value1 == value2) { return 0 } else { return 1 } }, const arr = [186, 100, 446, 372, 273] console.log(arr

2020-09-24 11:51:10 166

原创 js获取与指定的值最近的数组元素

js获取与指定的值最近的数组元素near(arr, n) { arr.sort(function (a, b) { return Math.abs(a - n) - Math.abs(b - n) }) return arr[0] },const arr = [0, 122, 133, 178, 190]console.log(arr, 120) // 122

2020-09-24 11:40:17 712

原创 ** Vue下js点击按钮元素左右滚动效果 **

** Vue下js点击按钮元素左右滚动效果 **小程序、前端交流群:609690978 先上效果图代码:<div id="classifyScroll" :class="showLeftIcon ? 'active' : ''"> <div class="classifys"> <van-icon name="arrow" class="rightIcon" v-show="s

2020-09-23 18:49:22 5655 5

原创 js 循环删除数组中指定的或符合条件的对象或重复的对象

一般删除数组中的某个对象或元素,我们会用到splice,如:const arr = [1, 2, 3, 4, 5]arr.splice(0, 1) // [2, 3, 4, 5]如果要删除某个指定的对象或元素,如,删除3:const arr = [1, 2, 3, 4, 5]arr.splice(arr.findIndex(item => item === 3), 1) // [1, 2, 4, 5]但是,如果要循环删除数组里但某个对象要如何操作呢?如下数组:const arr =

2020-09-10 15:00:23 6024 2

原创 **【组件】vue实现自定义tab栏下划线滚动过渡效果以及点击当前tab自动居中**

vue实现自定义tab栏下划线滚动过渡效果以及点击当前tab自动居中小程序、前端交流群:609690978先上效果图组件代码:<template> <div v-if="list.length > 0" class="tabBlock"> <div @scroll="scroll" class="tabContent"> <div ref="tabContentScroll" class="tabContentScroll"&

2020-05-12 18:03:24 2910 1

原创 1.NodeJs基础一 :NodeJs HTTP 模块、URL 模块、 supervisor 工具

NodeJs HTTP 模块、URL 模块、 supervisor 工具一、Node.js 创建第一个应用如果我们使用 PHP 来编写后端的代码时,需要 Apache 或者 Nginx 的 HTTP 服务器, 来处理客户端的请求相应。不过对 Node.js 来说,概念完全不一样了。使用 Node.js 时, 我们不仅仅在实现一个应用,同时还实现了整个 HTTP 服务器。1、引入 http 模...

2020-04-12 23:46:35 288

原创 **JS for循环、map方法对树形结构数据的处理**

小程序、前端交流群:609690978tree树形结构的处理方法:首先要满足两点:1.数组内每个对象都得有自己独一无二的id2.数组内每个对象都得有其父级id且第一级的父级id为0例如: let data = [ { "id":"1", "name":"第一级", ...

2019-09-04 17:45:18 2959

原创 **微信小程序常用方法、API封装之微信支付封装**

小程序交流群:609690978今天介绍一下微信支付吧,没有接触过的也没关系,简单点说,就是要先下单,获取微信统一下单prepay_id,当然,需要把订单id传给后台,然后返回给你一些信息,比如时间戳,签名什么的,具体的有以下参数:然后,你需要通过wx.requestPayment接口把这些参数传给微信支付接口发起微信支付。所以,如果你按部就班的写的话,就会这样:wx.request下单,...

2019-07-19 15:07:46 242

转载 webpack安装配置以及填坑操作之 webpack command not found 的解决方法

转——https://blog.csdn.net/qq_38111015/article/details/79013475

2019-07-12 17:19:22 716

原创 **纯CSS实现瀑布流布局**

小程序交流群:609690978先上图,要分几列进行瀑布流可自定义:上代码:<div class="box"> <div class="box-item" v-for="(item,index) in imgList" :key="index"> <img src="item"> </div></div>重点来了...

2019-07-08 10:46:17 246

原创 **微信小程序自定义组件Component及Template模板详解**

小程序交流群:6096909781.template关于template模板的话,我就长话短说。简单点讲,如果你有多个页面使用的UI布局都是一样的,又没有什么逻辑,比如首页有一个热销商品,商品列表又有个一样的布局,如下图:像这样的,你点击一下就会进入到商品详情页,没有其他任何逻辑,单纯的为了展示,你就可以使用template。1.新建一个template文件夹,在里面建子文件夹good...

2019-06-17 09:23:10 398

原创 **微信小程序常用方法、API封装之alert + showToast + 节流函数**

小程序交流群:609690978##小程序在创建项目的时候,会有一个utils文件夹,下面有个util.js文件,这个就是给大家存放封装函数用的。当然,你也可以自己写个js文件进行封装,只是调用不同罢了。今天就给大家分享一下一些常用的方法或API。1.alert众所周知,小程序是没有alert弹框的,但是为我们提供了wx.showModal这个API。(具体如下图)但是,每次写个弹框都这...

2019-06-14 17:26:34 2816

原创 **微信小程序常用方法、API封装之网络请求(wx.request)+ 接口(API)封装**

小程序交流群:609690978首先了解一下,为什么要封装网络请求和API。我认为一切封装都是为了简化开发,便于维护。比如,wx,request这个网络请求的方法,完整的写下来,是这样的: wx.request({ url: 'test.php', //仅为示例,并非真实的接口地址 data: { x: '', y: '' }, header: {...

2019-06-14 17:23:49 1320

原创 **【全局分享】微信小程序设置全局分享(标题,图片,路径)**

页面分享内容都一样,但是要在每个页面里都写是不是很烦?没关系,下面教你如何解决://重写分享方法 share: function () { //监听路由切换 //间接实现全局设置分享内容 wx.onAppRoute(function (res) { //获取加载的页面 let pages = ...

2019-06-12 16:32:26 7509 2

原创 记一下绝对定位下的各种居中问题(水平居中或垂直居中)

平时碰到的问题基本上都是要求垂直且水平居中,这里我就不介绍绝对定位下的垂直且水平居中的方式了,百度一下多的很。今天碰到的问题是,一个导航栏,居左且垂直居中,百度了一下,全是水平且垂直居中,很烦,还是自己写吧。1.垂直居中且左对齐.div{ position: absolute; bottom: 50%; left: 0; transform: translate(5...

2019-06-03 17:48:46 2042

原创 **微信小程序 分页加载 (上拉加载) **

聊一下小程序的下拉加载功能,其实很多人依赖于后台的返回的page页数和total总条数其实这两个参数都不需要,下面介绍一下如何实现1.首先,在json文件里配置如下:(其实配不配无所谓,我亲测不写这个也可以,但是还是写上吧,规范一点)"enablePullDownRefresh": true2.设置js变量:Page({ data(){ isMore:true, //是否有...

2019-05-30 17:06:37 1260 7

原创 VUE父子组件监听状态变化

在不使用VUEX的情况下,通过props传值,父组件直接修改子组件的相关数据会报错。这里以父组件弹框为例讲一下如何操作……父组件html<father @changingType="showDialog" :showPopup="showPopup" ></father >父组件 jsexport default{ props:['showPopu...

2019-05-30 15:31:05 2440

转载 js 数组 map() 基本用法【转】

var data = [3, 4, 5, 6];var Squares = data.map(function (item) { return item * item;});console.log(Squares);// [9, 16, 25, 36]```var users = [ {name: "张含韵", "email": "zhang@email.com"}, ...

2019-05-30 10:44:43 2458

原创 微信小程序 使用Vant 的SwipeCell组件时,scroll-view无法滚动页面的解决方案

这是vant的一个BUG,解决方式如下:1.找到swipe-cell的目录,主要修改wxml和js。2.如下图

2019-05-17 19:51:33 6658 1

原创 VUE-CLI3.0按需引入elemet-ui的方法

在VUE-CLI 2.0版本中,按需引入elemet-ui的方法是安装npm install babel-plugin-component -D后,将.babel文件修改为:{“presets”: [[“es2015”, { “modules”: false }]],“plugins”: [[“component”,{“libraryName”: “element-ui”,“sty...

2019-05-14 10:02:18 743

原创 **ES6快速删除数组中指定元素的方法**

let arr =[{id:1},{id:2},{id:3},{id:8}]let id = 8arr.splice(arr.findIndex(item => item.id === id), 1) // [{id:1},{id:2},{id:3}]

2019-05-08 17:34:44 7122

空空如也

空空如也

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

TA关注的人

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