- 博客(62)
- 资源 (12)
- 收藏
- 关注
RSS订阅
原创 我的小笔记 =》其他东东
gitee相关操作git init #初始化git add . #将当前目录加入到gitgit commit -m "first commit（提交的描述信息）" #git提交到本地版本库git remote add origin http
2021-06-10 11:32:40
244
原创 JavaScript常用的数组操作对象方法
文章目录==对象方法==++搜索、索引`indexOf() ` ：搜索首个数组出现的位置`lastIndexOf() `：搜索最后出现的数组位置++截取、提取`lastIndexOf() `：搜索最后出现的数组位置==需要看更多？==++[菜鸟教程数组操作合集地址](https://www.runoob.com/jsref/jsref-obj-array.html)++[w3school数组操作合...
2020-04-01 10:55:47
2755
2
原创 JavaScript常用的字符串操作对象方法
文章目录==对象方法==++搜索、索引`indexOf() ` ：搜索首个字符串出现的位置`lastIndexOf() `：搜索最后出现的字符串位置`charAt() `：搜索返回指定位置的字符++截取、提取`substring()`：返回指定索引区间的字符串`slice()` ：提取字符串的某个部分，并且返回的字符串是新的`substr()` ：抽取指定下标到指定数目长度的字符串++分割成数组`...
2020-03-25 09:15:58
606
原创 我的小笔记 =》原生微信小程序
1.封装http新建utils目录与pages文件夹同级，然后创建config.js文件数据如下图。（GetReserveShop_config为自定义的名字）/** * 小程序后端接口配置文件 */var host = "https://xxx.net"var config = { // 下面的地址配合 Server 工作 host, //配置 GetReserv...
2019-07-24 11:10:32
320
原创 我的小笔记 =》Vue
一.数组循环遍历//includes筛选用法let arr = ['a','b','c'];arr.includes('a')//全选框的例子var allChecked ;arr = [true,true,false] if (arr.includes(false)) { this.allChecked = false; } else { this.al...
2019-05-31 14:55:23
183
原创 vue3中怎么巧妙的去运用jsx？
我们都知道vue3是支持用jsx/tsx，但是好像从来都没有人告诉我们应该怎么运用到项目当中，下面是我觉得不错的一种使用方式，分享给大家。
2023-12-26 16:30:43
1118
原创 vue3移动端适配的解决方案
最近在给公司内部做一个BBS论坛，需要在电脑和手机上都可以操作，所以需要做移动端的适配，下面是我在开发后觉得不错的一些解决方案，分享给大家。
2022-12-03 12:30:37
10822
2
原创 vue3中使用Apache ECharts
首先祝贺Echarts顺利的从Apache毕业，多了个响亮的名字：，现在的官网地址在这里：传送门，首页相当的国际范，看着比以前舒服多了，但是文档还是那个文档(Ｔ▽Ｔ)最近在做一些数据透析的项目需要用到报表图，那么报表图好用的有老牌的ECharts，比较新意的AntV，思前马后的想了一下还是用了Echarts，因为AntV的产品线真的是五花八门，比如G2、G6、F2、L7，看得我头晕眼花，所以决定用Echarts省事多了。二、测试运行测试的话直接用全量引入了，看着简洁点。使用的话还是和以前差不多，获取
2022-11-01 09:23:54
773
1
原创 vue3 el-table多级表头收缩扩展的实现
最近在做一些数据展示类型的项目，其中有一个表格需求把我吓懵了，大概是这样的，表格的每一行数据可能会有子集，父级行要与子集行用颜色区分开来，这个好处理，el-table给我们提供了树形数据与懒加载来处理每一行存在层级的关系，行的颜色可以用table-属性的来动态绑定颜色；另外是表头，表头有多级，这个官网的多级表头有，除此之外一个多级表头可能还会有子集，并且需要收缩扩展和颜色区分，颜色区分可以用table-属性的提示。......
2022-07-30 13:01:37
3076
原创 vue3中使用Web Worker多线程
最近在做vue3的项目中，遇到了计算量庞大导致页面响应缓慢的问题，正好每个计算任务的结果不需要汇总，所以想到了以多线程的形式去执行每个计算任务。但是通过一轮google、baidu都没有找到vue3的案例，还好在外网的一篇案例中嗅到了一丝可能。大佬可以跳过， 对于Web Worker多线程可能有很多小伙伴还不知道是干嘛的，所以我先举一个列子让大家知道它大概是用来做什么的。①洗完澡后再洗衣服： 在没有洗衣机（Worker）前，通常都是先洗完澡后再手洗衣服（这里我除外，我都是踩着衣服一起洗澡的），这样我们每天都
2022-06-18 10:55:05
13052
15
原创 vue3中使用swiper7轮播图插件
项目场景：前不久刚在我的vue3项目中用了swiper6，坑真的是比农村的泥路还要多，这不官方直接来了个swiper7，接下来手把手教下大家怎么用，让大家少走弯路。另外swiper7的话不会出现打包后放服务器样式丢失的情况了=》swiper6普通vue3项目：win10的小伙伴我们可以先在桌面（或者文件夹里）按住Shift之后点击右键打开Powershell窗，不是的自己打开cmd，效果是一样的。之后在命令行里面输入vue create vue3接着选择创建默认的vue3项目接着用V
2021-11-16 18:03:40
10834
35
原创 微信小程序全局组件的定义
项目场景：在做项目中，当我们写到一些共用的js代码时，为了去耦合实现模块化，会把共用js代码提取出来封装好，哪里需要使用到的引用一下就好了。同理的，在小程序开发中，为了精简化项目，我们可以把共用的一部分代码（比如说登录弹窗、活动状态弹窗等）提取出来，写成组件，需要用到也页面引入一下就好了。Demo演示：为了方便演示父页与子组件间的数据传输，我写了个简化版的全局登录弹窗，具体可以看下面的GIF代码部分：项目结构： 我们先看下目录的具体结构，一般情况下创建的组件都会放到components文件夹
2021-10-02 15:16:04
3567
2
原创 微信小程序云开发-证件照的实现
项目场景：最近发现一些好玩的小程序，那就是证件照制作，不知道是干嘛的可以微信搜索一下“证件照”，会有特别多这样的小程序，自个体验下，那么在小程序云开发中可以怎么去实现这一功能了？效果展示：功能分析：首先我们来分析一下这项目的大致功能，首先需要一张图片，然后把这张图片的人物与背景分离，接着把分离后的人物放到一个容器，之后做一个选项按钮来更改容器的背景颜色，最后将其合并保存成新的图片就好了。具体实现： 1.首先为了方便截取图片，我使用了SimpleCrop截图插件，但是在开发过程中，我发现用
2021-09-01 09:11:52
4541
53
原创 微信小程序云开发如何将页面生成为pdf?
项目场景：最近有小伙伴问了一个问题，那就是在微信小程序云开发如何将页面生成为pdf？但是在没有后端工程师的协助下，我们要怎么办了？解决方案：于是便逛了一下午的微信社区，但很遗憾腾讯baba没有给出相应的api或决绝方案，好在有神奇的留言，找到了关键词，那就是wxml→canvas→img→pdf，wxml转化转化成canvas之后在生成img，微信官方已经给出了组件wxml-to-canvas可以解决，那么img转化成pdf要怎么办呢？可以用pdf-lib，好在看到了黄宝～这位大佬的文章，省去了很多
2021-08-17 15:05:46
10453
27
原创 微信小程序云开发之券码领取，怎么防止用户领取到相同的数据？
项目场景： 之前在云开发中遇到了券码领取类型的活动， 但是在没有后端提供接口领取的情况下，我们要怎么去分配券码给用户了？问题描述：当项目把一批券码发过来的是后，我的第一反应是给每一个券码都加上一个boolean值，用于标识当前的券码有没有被领取过，当用户点击领取时，把预先存放在云数据库表里的集合数组拿过来，之后循环数组，直到遇见未被领取过的那一条数据，把它发放给用户，之后把云数据库表里的这一条数据状态改已领券。但是，当我做完后，我发现了一个问题，那就是当用户A和B同时点击领取时会领取到相同的券
2021-08-02 14:33:51
574
原创 vue3项目打包部署服务器后swiper6控件不显示，模块样式丢失
问题描述：最近在用vue3部署自己的个人主页，其中用到了最新版的swiper6.7.0，在本地中打开是没有任何问题的，但是当我把项目打包部署到服务器后，发现swiper6控件不显示，两侧切换卡片的按钮（Navigation）和页数小圆点（Pagination）都不显示，于是就打开浏览器控制台看了下，发现控件的HTML结构是有的，但是CSS样式却没有，于是便百度谷歌，但是依旧没能解决这个问题，最后自己折腾了一宿，终于解决了(Ｔ▽Ｔ) 解决方案：swiper6官网模板里引用样式用的是import /
2021-06-20 17:22:48
1258
11
原创 vue3中怎么使用router路由呢&页面跳转传参怎么搞呢
描述：最近想弄一个自己的个人主页，正好vue3也已经出来了，想尝鲜，于是便用vue3来构建了自己的项目，结果处处碰壁，不过这是好事，说明又有很多新的东西学了（等会，我2.x还没学废(ಥ﹏ಥ)）。好的，接下来要分享的是在vue3中要怎么去使用router路由。1.安装 npm install vue-router@4 --save...
2021-06-01 09:19:48
12097
8
原创 微信小程序九宫格抽奖和转盘抽奖的实现
描述：最近在工作中遇到了小程序抽奖的一些页面制作，以前制作网页抽奖的时候，在jQuery插件库谁便找一个Demo就可以满足我们的需求了，自己动手写的话不仅会拖慢项目进度，而且写出来的也未必有别人的那么流畅自然。而在小程序中我们就没有这么幸福了(ಥ﹏ಥ)，并没有丰富的插件库供给我们使用，所以该写的还得自己动手写。好了，下面是常见的两种抽奖方式：九宫格和转盘，在实际项目中用的还不错，分享给大家。一、九宫格抽奖：效果：思路： 首先是结构上，用弹性布局就可以了，每一个奖品的宽度设置成3分之1，超
2021-05-07 20:08:18
13686
20
原创 前端应该怎么初始化移动端的像素单位呢？
随着前端技术的不断发展，移动端的需求不断增大，只适配pc端的界面已经无法满足用户的需求了。pc端的适配一般用CSS3 多媒体查询去适配几个阶段（如1600px,1920px）的像素就好了，这篇文章就不重点讲了，wap手机端就有点不一样了，那么要怎么去适配wap手机端的界面呢？要适配wap手机端的界面的话，css需要以rem为单位，然后用css或js动态的去调整html根节点的像素大小就好了。
2021-01-06 11:27:45
1064
原创 微信小程序自定义swiper轮播图面板指示点|小圆点|进度条
描述：在工作中开发一个页面，多少都会用到轮播图，但是由于微信官方提供的轮播图swiper组件局限性太大了，所以接下来我会教大家怎么去自定义轮播图的进度条。简单修改：如果你的项目只是简单的修改小圆点的颜色，那么只需要修改官方提供的indicator-color和indicator-active-color参数就可以了 属性 类型 默认值 说明 indicator-color
2020-12-12 18:28:15
19932
8
原创 微信小程序怎么批量生成带参数的小程序码？
最近在工作中遇到了一个问题，公司需要批量生成二维码，但是通过微信公众平台生成只能一次生成一张，如果通过云函数循环的去调用云函数api生成的话实现起来也比较费时间，所以最终找到了一个第三方的网站-草料二维码生成器，使用后还不错，分享给大家。草料二维码怎么通批量生成带参数的微信小程序码？效果我录制了一个GIF大家可以看一下，挺方便的，只要把图片的文件名和二维码的参数排列到excel表就可以批量生成了。详细步骤首先我们就进入草料二维码官网，然后用微信扫码快速登录一下就好了，因为我们只用生成二维码的
2020-10-25 15:28:17
2968
原创 微信小程序云开发之模糊搜索
以前在做前后端分离的项目时，要实现一些搜索框的模糊搜索时，运气好一点，后端攻城狮会处理好逻辑，前端只需在输入框的value值发生变化时去调用接口重新渲染数据就好了。运气差点，后端攻城狮只会给你一个总的数组，然后在值发生变化时得自己动手写逻辑去筛选数据。那么在微信小程序云开发上是怎么实现的了？微信小程序云开发之模糊搜索可以重下面的例子看到...
2020-10-24 17:28:42
6988
16
原创 微信小程序通过云函数生成带参数的小程序码
微信小程序通过云函数生成带参数的小程序码小程序云开发还是挺强大啊，以前动不动就需要后端攻城狮进行操作，现在没后端啥事了，但是头发却开始紧张了啊！o(╥﹏╥)o效果：接下来我说一下学了云函数后，如何通过云函数生成带参数的小程序码，具体效果请看GIF。然后手机上的话，大概是接过样子的憨憨模式：在没有用云函数时，只能先在微信公众平台去生成带参数的小程序码，接着，因为路径不支持中文，所以只能在接收到参数时在onLoad中去判断后另外赋值， onLoad: functi
2020-09-10 09:16:05
2089
7
原创 微信小程序云开发快速入门手册-告别切图仔的时刻到了
文章很长，建议先收藏，有充分的时间再学习，没有小程序基础的，也阔以先收藏哦。 本文章会手把手带各位小伙伴入门微信小程序云开发，因为我还不是全栈工程师，所以不是特别清楚前后端分离模式下，后端工程师需要做的具体事情，所以我就不扯普通开发模式和云开发模式的区别了以及其他相关的理论知识了，不过各位放心，我有信心教会各位怎么在实际项目中使用云开发模式。 ٩͡( ｡ớ ₃ờ)۶呵呵下面这张图是我自己理解的云函数开发模式，大家阔以瞄瞄。(づ◡ど)1、 首先云开发给我们提供了三大功能：2、其次等我们写完静态代码后，就可
2020-09-03 22:25:46
1952
2
原创 JavaScript中console的用法，console：我是最靓的仔！
JavaScript 中 console 的用法4种信息输出方式（可以用\n换行）： console.log('log\n最常见用法'); console.info('info\n打印一般信息'); console.warn('warn\n警告信息'); console.error('error\n错误信息');清空控制台输出： console.clear();//清空控制台清理完毕后会提示控制台被清除：百度的输出：想了解更多可以去MDN看看：传
2020-06-15 16:41:35
2645
5
原创 我的小笔记 =》Node.js
内容源于阿里云大学——前端开发学习路线目录一、node.js是什么？二、node.js有哪些特点？三、node.js安装和配置四、node.js开发网站和传统PHP等开发网站的区别一、node.js是什么？1.node.js是一个开发平台，就像Java开发平台、.Net开发平台、PHP开发平台、Apple开发平台一样。何为开发平台？有对应的编程语言、有语言运行时、有能实现特定功能的API（SDK：Software Development Kit）2.该平台使用的编程语言是JavaScrip.
2020-06-07 11:14:09
239
原创 JavaScript实现图片懒加载，了解一下？
最近在给公司写微商城，但是写完后单页的商品太多，导致图片加载很慢，而且我发现公司给服务器域名限制了单个IP器访问速度最高只有500K/s，面对这种情况，只好对图片进行懒加载处理了。接下来要给大家到来的是前端图片懒加载的实现和思路，主要分两种：纵向的和横向的。不管是纵向的还是横向图片懒加载实现的思路都是一样首先在第一次渲染列表图片时，不要把图片路径直接赋值给src（不然的话整个页面的图片都会...
2020-05-07 20:45:49
1815
1
原创 移动端弹窗插件mobileSelect的使用，送上全国城市的json
用过很多移动端弹窗插件，但还是觉得mobileSelect好用，样式好看，过度动画也很棒，所以推荐给写移动端的小伙伴们。点击查看jQuery插件库的说明和文件下载（下载要积分）点击查看jQuery插件库的演示Demo（此Demo并非本人的）点击查看在GitHub上的项目（免费下载）使用方法GitHub上下载项目下载完解压后分别把css文件夹、js文件夹的mobileSelect.cs...
2020-02-21 10:17:01
2218
6
原创 微信小程序红包（优惠劵）弹窗的实现
现在的小程序红包、优惠劵满天飞，So，老板终于忍不住把产品经理叫了过去，苦逼的我只好摸了摸头，瞬间安心了。好了，接下来分享个小程序红包（优惠劵）弹窗给大家，效果看我录制的GIF。首先梳理一下我的思路，先是设置一遮罩层悬浮，宽高沾满，然后在遮罩层的上一层再设置一个盒子也是悬浮且宽高沾满，里面内容居中的话用弹性布局就好了，然后再内容用catchtouchmove禁用滚动条，禁用滚动条没必要放...
2020-01-21 16:27:33
7540
5
原创 微信小程序自定义navigation-bar导航栏(自适应安卓苹果)
最近在写商城，中途遇到了需要自定义修改导航栏的操作，大概是如下图接过样子的，于是想手写一份，但我发现右上分的分享按钮在不同设备离顶部的距离是不一样的，于是找了下官方程序员写的文档(点这里查看)，(⊙o⊙)…一脸懵逼咧，貌似不能满足这需求，而且后续也要实现点击导航滚动定位，组件传参麻烦，而且未必能实现，于是我把WeUI的navigation-bar组件的精华提取出来写了一份。wxml文件<...
2020-01-02 23:11:44
20042
8
原创 前端实现滑动页面动态切换背景图片的炫酷效果
我发现现在很多网站都用了如下GIF的模块与背景图片切换的效果，这让在下心痒痒的，所以自己动手写了一遍发现蛮简单的，分享给大家！首先我的思路是介个样子的：先让一个空的宽度高度都占满的div孩子悬浮最底层，里面设置宽度高度都占满背景图片，这样底部的图片就搞定了；然后再设置竖直排列宽度高度都占满的div模块，模块的排布为：实体模块=》透明模块=》实体模块=》透明模块=》实体模块，这样的话向下滑动滚动...
2019-11-22 10:56:42
7904
1
原创 微信小程序中实现点击导航条切换页面（可左右滑动视图）
我录制了个gif如下，黄色部分是不可以滑动的，蓝色部分可以滑动。wxml代码：首先在js定义了navState用于判断导航的当前状态，定义了data-index用于js中动态修改导航的当前状态，nav-switch-style为选择导航条时的样式，不可滚动视图切换很简单，用wx:if判断转态显示相应页就好了，滚动页视图切换要用到swiper和 swiper-item，用bindch...
2019-11-05 14:40:41
13873
12
原创 微信小程序中实现点击导航标签滚动定位到对应位置
公司的项目不好展示效果，我就直接用我的简历小程序示范了wxml部分specify-style是我自定义选中标签时的样式，可自行更改；block_ScrollTop多减70是因为我的导航是悬浮的，会挡住部分内容，自行修改；板块里的内容就不给了，自己随便写点东东； <!-- 导航 --> <view class='nav' id="tab-con"> &...
2019-10-12 20:23:07
8896
5
原创 微信小程序返回上一页携带参数
首先用navigateBack返回的流程一定是这样的：A页面跳到了B页面，B页面要返回A且代参在B页面wxml写了个按钮点击<button bindtap="lastStep">点击返回页面A</button>在B页面js中编写返回代参的方法 //选择项目 lastStep: function() { //自定义返回值 let returned...
2019-10-12 14:25:07
1308
原创 微信小程序用npm导入WeUI以及使用
首先进来的我相信都会用npm了，不会的滚出去度娘学习下。配置package.json文件我新建了个项目叫test，然后在项目目录栏上输入cmd回车键进入命令行然后在命令行输入npm init回车键然后会提示输入项目名、作者等，一直按回车键就可以了，因为后期可以改的。然后会提示确定，yes回车键导包与构建然后输入npm install --save weui-miniprogram...
2019-10-10 16:37:07
5310
原创 微信小程序中实现点击当前标签改变样式以及同时改变后几个标签的样式
如下图，这便是我要实现的效果，点击11点添加样式随后的11点半和12点也添加样式，做小程序的你应该可以发现下边的时间数组并不是一次就可以遍历完，上午、下午、晚上各循环了一遍，之前我用JS和JQuery写过了一遍一样文章：点击跳出，但是小程序并不支持DOM对象，所以这里来看下小程序是怎么实现的。先看下wxml我的思路是这样的，首先在循环遍历数组时判断上午下午晚上的时间进行输出，我直接用字符串进...
2019-10-09 14:08:47
5365
原创 微信小程序中使用ECharts&怎么动态绑定数据？报表数目不确定怎么办？
快速到达官网：ECharts官方网址说明ECharts相关JS文件导入项目下载GitHub项目：ECharts官方给的GitHub项目然后把ec-canvas文件夹放到你项目的pages同级目录pages下4个文件引用与使用下面是我工作中的某一个页面page（需注意导入路径，我这page离根目录3层，所以是../../../ec-canvas/ec-canvas）.json文件...
2019-10-08 14:32:49
2337
5
原创 微信小程序wxParse循环输出多个HTML富文本（标签）
如下图，这是我要实现的效果，每一行都是一个超文本。经过一番百度我找到了官方给的列子：wxParse多数据循环使用方法但是我发现输出的结果是介个样子的，这样我很懊恼于是进过一番尝试我发现可以用index解决，有两重循环，其实都是循环同一个数组，我给两for循环添加了一个for-index分别为idx和idx1，输出时我让他两相等才通过，这样就可以解决这个问题了<block wx:f...
2019-09-29 17:44:53
1366
2
vue3中怎么巧妙的去运用jsx？
2023-12-26
vue3移动端适配的解决方案（老方案）
2022-12-01
vue3移动端适配的解决方案（使用插件）
2022-12-01
vue3中使用Apache ECharts（TS风味版）
2022-10-28
vue3中使用Apache ECharts（JS原味版）
2022-10-28
vue3 el-table多级表头收缩扩展的实现（TS风味版）
2022-07-27
vue3 el-table多级表头收缩扩展的实现（JS原味版）
2022-07-27
vue3中使用Web Worker多线程（TS风味版）
2022-06-17
vue3中使用Web Worker多线程（JS原味版）
2022-06-17
微信小程序云开发-证件照的实现
2021-08-28
微信小程序云开发将页面生成为pdf
2021-08-17
微信小程序云开发券码领取Demo.zip
2021-08-02
前端始化页面像素单位-响应式网站模板
2021-01-06
前端始化页面像素单位-非响应式网站模板
2021-01-06
微信小程序通过云函数生成带参数的小程序码wxacode.getUnlimited版
2020-09-09
微信小程序通过云函数生成带参数的小程序码wxacode.get版
2020-09-09
移动端弹窗插件mobileSelect可用的全国城市的json文件
2020-03-03
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人