Smell_rookie的博客_小佑@小佐_CSDN博客-项目总结,前端知识,连续剧领域博主

私信关注

小佑@小佐

码龄4年

写好每一天的bug

毕业院校岭南师范学院
于 2017-10-14 加入CSDN

获得成就

获得715次点赞
内容获得954次评论
获得463次收藏

荣誉勋章

兴趣领域

#前端

#ECMAScript 6#JavaScript#Node.js#CSS#HTTPS#前端框架#Vue.js#React.js#TypeScript#WebPack#面试#小程序

TA的专栏

项目
3篇
连续剧
9篇
其他
8篇
项目总结
16篇
前端知识
10篇

强烈推荐

关注公众号

更多精彩内容尽在《贩卖前端仔》公众号

资源下载

[推荐] 程序员专属的代码拜年网页(纯Js+html)

Vue搭建的服装类商城手机模板

python京东茅台脚本

[推荐] 新年烟花代码(纯Js和html)

直接安装的Vue-devtools调试工具

有大佬公众号文章内互推公众号名片的吗？大家一起交流交流。

发布Blink于昨天

免费送！素材库网站会员兑换码

今天小编给大家带来一波福利，免费送各大素材库网站的一个月期限的会员兑换码???? ???? ，那都有哪些素材库网站会员呢？没错，小编给大家带来8大网站有效期一个月的会员(前两个太火爆目前没有兑换码了，小编会持续跟踪…)，这8大网站的会员对于苦苦追求设计图素材和在线公众号文章排版的小伙伴来说，可谓是巨大的福利。每个网站只有一个兑换码，先到先得，送完即止哦。要是迟到没拿到兑换码的小伙伴不要灰心，可以找我免费下载图司机网站的无水印无损高清素材图。领取方式：关注<贩卖前端仔>公众号，发送“领

素材库网站会员免费撸，一个月有效，快上！😄

免费送！素材库网站会员兑换码

发布Blink于 6 天前

element的el-table列标题添加自定义图标

大家好，我是小佑@小佐https://blog.csdn.net/Smell_rookie，是一名页面仔工程师，我会不定时在CSDN更新我的博客，有兴趣的可以点个关注来逛逛我的主页。需求：开发中我们会遇到在el-table的列标题那添加操作图标，如下图：实现：其实el-table有提供一个render-header方法，但是没有提供具体的案例，今天遇到了就做个小总结。<el-table-column label="操作" fixed="right" width="100" :render-

vue+element使用sortable拖拽实现行排序

大家好，我是小佑@小佐https://blog.csdn.net/Smell_rookie，是一名页面仔工程师，我会不定时在CSDN更新我的博客，有兴趣的可以点个关注来逛逛我的主页。需求：有时我们想要做成这么一个效果——对ele的表格实现行排序，可以拖动！借助sortable我们可以完成上述需求。安装sortablejsnpm install sortable.js --save 或 yarn add sortable引入并使用在需要使用拖拽的.vue页面引入sortablejs 也可

CSDN花里胡哨的自定义模板 https://blog.csdn.net/Smell_rookie/article/details/114278461?utm_source=app&app_version=4.5.2

发布Blink于 1 月前

CSDN花里胡哨的自定义模板

大家好，我是小佑@小佐：https://blog.csdn.net/Smell_rookie，是一名页面仔工程师，我会不定时在CSDN更新我的博客，有兴趣的可以点个关注来逛逛我的主页。一次偶然的机会让我获得了一个月的CSDN会员，从此我便发现了这个有趣的玩法！在内容管理模块里面的自定义模块只要你CSDN的会员你就有权限去设置这个东西，先来看看它张什么样子吧！旧版时展示的样子：新版时展示的样子：总的来说就是博主的想给粉丝展示的东西，可以说是博主的一个变现手段，让粉丝最直观地发现博主展示的东

程序员祝福拜年网页（纯js+html）

程序员专属的拜年方式 —— 网页特效拜年,属于你的特殊方式！效果截图：https://img-blog.csdnimg.cn/20210211091708386.jpg

zip

发布资源于 2 月前

人人都可免费定制微信红包封面，无需审核！ https://blog.csdn.net/Smell_rookie/article/details/113750486?utm_source=app&app_version=4.5.2

人人都可免费定制微信红包封面，无需审核！

发布Blink于 2 月前

人人都可免费定制微信红包封面，无需审核！

目前，微信再次玩出新花样——任何微信用户都可以定制自己专属的微信封面红包，并且无需审核，提交即可使用。如你想制作DIY的封面红包，你只需满足以下两个条件即可：1、开通视频号。2、发表一个视频号内容并获赞10个这两个条件比起之前的个人视频号认证、企业资质认证简单的太多了，现在就让我教你如何操作吧。1、满足以上两个条件的基础下2、再次去视频号发布一段视频或者几张图片，作为红包封面图片的备用图3、点击链接：https://sourl.cn/2pQuLi（微信打开）4、点击【开始制作】，添加图片

支付宝的福已到

集齐支付宝福卡秘籍来了！

临近过年????，大家都在开始集支付宝的福卡活动了吧，下面就让我为你揭秘下快速并保证能集齐无福的方式吧1、打开支付宝，点击“一起集福”，进入后可以通过AR扫福和写福字获得福卡2、2月4日起蚂蚁森林和2月7日芭芭农场做任务也能得福卡3、在“支付宝”里点开以下链接，可以开福气盲盒，随机获得福卡⚠️：链接请复制到支付宝里面点击1、天猫精灵：https://render.alipay.com/p/c/17yq18lq3slc?source=JING_LING2、飞猪：https://render

基于ElementUI的el-upload组件二次封装

大家好，我是小佑@小佐 https://blog.csdn.net/Smell_rookie，是一名页面仔工程师，我会不定时在CSDN更新我的博客，有兴趣的可以点个关注来逛逛我的主页。前言：开发工作中我们都会遇到图片上传的问题，虽说ElementUI已有提供图片上传的组件，但我们用到图片上传的地方肯定不止一处的，并且框架自带的组件并不能完全满足我们的需求，为此我对原有组件做了二次封装，做到一次封装，到处使用！直接上代码：组件：**uploadImg.vue**<template>

CSDN会员免费拿🔥🔥🔥，实现CSDN会员自由的机会到了！！！ https://blog.csdn.net/Smell_rookie/article/details/112763485?utm_source=app&app_version=4.5.0

CSDN会员免费拿，实现CSDN会员自由的机会到了！！！

发布Blink于 3 月前

CSDN会员免费拿，实现CSDN会员自由的机会到了！！！

vue搭建的服装类商城手机模板

vue cli脚手架搭建的服装电商类移动端商城网页模板。包含：购物车，收藏，提交订单，修改订单，删除订单，修改添加地址，登陆注册等功能。ps：不懂vue cli 技术，切勿下载使用。效果链接：http://template.clothingmallphone.huangzequn.top

zip

发布资源于 3 月前

我的第700个粉丝是你吗😏

发布Blink于 3 月前

python京东茅台脚本.zip

最近热门的python京东茅台脚本

zip

发布资源于 3 月前

新年烟花代码(纯js和html)

可以随时嵌入项目的新年烟花代码，复制即可运行。效果可看：https://www.jq22.com/demo/canvas-firework201802150049/

zip

发布资源于 3 月前

新年第一行代码走起来😁https://huangzequn.top/

发布Blink于 3 月前

2020不忘初衷，2020继续前向！ https://blog.csdn.net/Smell_rookie/article/details/111556777

发布Blink于 3 月前

回看2020在前端路上的经历

前言：2020对我们每个人来说都是难以忘记的一年，我们在戴口罩中不知不觉得度过了一年，回望过去的前端职业生涯，是应该好好总结一番。在这个不平凡的2020，我从惠州辞职来到东莞寻求更宽广的道路，那时面试也像初出社会那般到处碰壁，几经折腾也没有找到自己满意的前端开发岗位的工作，也许是上天的不舍与眷顾，一次偶然的机遇让我入职了一家物流平台的公司。从此我也变得不再只关注前端的世界，我想尝试更为有趣的东西——数据的交互，也就是后端。然而，我此前并未接触过后端的东西，也不知道该从而下手，好在我之前有接触过Node

发布Blink于 4 月前

加油，打工人

发布Blink于 4 月前

[记录九]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——在服务器清除小程序上传的废弃图片

大家好，我是小佑@小佐，是一名页面仔工程师，我会不定时在CSDN更新我的博客，有兴趣的可以点个关注来逛逛我的主页。前言：首先，实现小程序上传与下载的逻辑我这里是这么实现的：小程序点击图片调服务器提供的api——服务器收到此请求获取图片文件的信息并读取和写入本地，比如写到项目的某个文件中去——然后在api中返回一个映射地址，此地址就是上传的图片的服务端项目的相对位置——小程序拿到地址直接显示，并在最终请求的时候已数组的形式发回给服务端——期间服务端会将小程序显示的图片地址对应的图片文件返回去。正常业务是这样

进万内了👧

付费资源你体验了吗😜😜😜

一懒就落后

个人开发者的小程序

最近做了个小程序，是个菜谱教程系的小程序，具体开发流程可以参考我的博客，地址：我是如何做一个属于自己的小程序的？贴出部分界面：更多小程序内容可以扫码查看

这周太难了

苦逼练车

等待你的阅读😏

早啊，打工人

爬取线上小程序源码看这一篇就够了！https://blog.csdn.net/Smell_rookie/article/details/109529322?utm_source=app

发布Blink于 5 月前

帮我上个7W可以吗🤓

发布Blink于 5 月前

爬取线上小程序源码看这一篇就够了！

前言：前段时间看到某某小程序做得还不错，对于开发者来说肯定想搞一搞接口和源码啥的，但是我用抓包软件发现抓不了，反扒了。所以就直接撸源码撸。前期准备以下都是在电脑上装的：手机模拟器：MUMU模拟器 / 夜神模拟器推荐使用MUMU模拟器文件管理器：re文件管理器装好上面的模拟器后，打开模拟器，在里面安装re管理器和微信：打开微信，访问你想要爬下来的小程序后使用RE管理器打开路径你会看到像c31ad******es72这样类似的文件，这是多个微信号产生的文件。怕找不到的话先删除掉这些类似的文件

涨粉涨得有点慢，要加油＾０＾~

新台阶 600粉💆

我是如何做一个属于自己的小程序的？https://blog.csdn.net/Smell_rookie/article/details/109354434?utm_source=app

发布Blink于 5 月前

😁

发布Blink于 5 月前

适合日常生活的多功能计算器可以了解下🤔

发布Blink于 5 月前

做自带流量的微信小程序，看这一篇就够了

第一步：注册一个邮箱账号备用。在微信公众平台上点立即注册，选择小程序填好刚才注册的邮箱和其他信息。点注册，然后去邮箱验证激活，之后信息登记，输入提示的内容。完成后登录在微信公众平台上扫码登录。手机上选择刚才注册的邮箱账号的小程序登录。我的是这个：进来后你可以对小程序的一些信息就行补充：我这里已经填写完了。接下来你需要在设置里面的开发设置中获取你的小程序appid这个AppID复制下来备用。第二步：打开微信开发者工具点击第一个框添加一个小程序—新建项目的信息：填好后点击新

我想问问现在还有人公司没交公积金的吗？点个赞让我知道我不是一个人😭

发布Blink于 5 月前

下一年还有吗😋

发布Blink于 5 月前

小程序接入vant Weapp组件的详细步骤

刚创建的项目的文件结构首先在你项目的根目录下打开终端，输入npm init 对项目初始化这时会生成pachage.json文件。继续在终端运行以下命令我这里用这个：npm i vant-weapp -S --production运行完如图所示：安装成功后回到小程序开发工具点击工具 => 构建npm运行完截图：完成后在编辑器右边的详情把红框内的打勾上使用组件在你想使用组件库的的json文件内引入组件。比如你想在fundIncome页面内使用button组件

祝各位节日快乐😉天天写bug😂

h5购物车功能实现里程碑祭奠1024

前言：本文实现购物车的思路是：获取后端的商品列表——前端本地缓存添加的商品数据——从缓存中获取数据渲染到购物车页面——从缓存中获取数据并提交订单。所以主要是购物车数据的存和取以及清除。商品选择页面分析：考虑到商品列表会多处使用，并且增加、减少商品数量的操作都是一样的，所以将右侧的列表做成组件。/*shopListRight.vue*/<template> <div class="shopListRight"> <div class="view-box"&g

一周又过去了🙄

少女心皮肤😃😃😃

5上6得上到什么时候

499了

从0再开始学一下收获还挺多👀

项目中总会用到的方法，即开即用（持续更新ing）

前言：你是否有这样的烦恼，每构建一次项目都会用到很多过滤器？本篇将为你解决这个烦恼，这里整理了很多在开发中需要用到的过滤器或方法，都是复制即用的。时间过滤器// 对Date的扩展，将 Date 转化为指定格式的String// 月(M)、日(d)、小时(h)、分(m)、秒(s)、季度(q) 可以用 1-2 个占位符， // 年(y)可以用 1-4 个占位符，毫秒(S)只能用 1 个占位符(是 1-3 位的数字) // 例子： // (new Date()).Format("yyyy-MM-dd

有兴趣可以进来了解一下 [记录三]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——token校验登录态 https://blog.csdn.net/Smell_rookie/article/details/108704245?utm_source=app

发布Blink于 6 月前

王者返场有投大圣娶亲的吗？😉

发布Blink于 6 月前

👀👀👀👀

发布Blink于 6 月前

基于php的酒店预订信息管理系统（自动化管理）

这是我的一个毕设项目，当初不懂java和node.js，所以选择了入门门槛较低的php，总体上达到了毕设系统的要求。涉及了多个模块，开发过程也慢慢得解决问题，一步一个脚印地去完成。这个系统可以说是在线预订客房和浏览酒店最新动态信息以及酒店管理员对酒店客房、用户信息、入住信息、餐饮预订等模块集于一身。界面也是自己的DIY审美（勿吐槽）。更多信息和源码可以直接去我的github地址查看。基于php的酒店预订信息管理系统...

定个小目标，这周上500粉💪

幸运继续努力✊

有东莞的大佬吗？有机会可以面基认识一下😄

感谢各位大家都关注👏👏

发布Blink于 6 月前

https://blog.csdn.net/Smell_rookie/article/details/108704245

发布Blink于 6 月前

你会是我的第300个吗😏

发布Blink于 6 月前

[记录八]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——使用定时任务执行脚本

前言：系统的日常维护必然不能单靠人24小时守着电脑去操作系统；像数据的同步、交易流水的校验、订单号的初始值等等需要在晚上或者系统使用量最低的时候去做，避免数据的丢失。为此选好时间让系统自动在那个时间去执行脚本就显得非常重要了。本节介绍定时执行脚本。下载node-schedule依赖yarn add node-schedule导入使用//app.jsconst schedule = require('node-schedule')const script = require('./util/s

[记录七]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——生成请求日志

前言：日志是系统非常重要的东西，倘若生成环境中突然报错或异常，要想快速知道哪里出现了问题，最快的方式就是查看系统日志。日志不仅仅是系统异常后帮助定位错误的作用，也可以了解用户操作了什么请求，客户端ip和所在地址都是可以知道的，将用户的操作信息保存下来供系统管理员查看。下面来看看node是如何将日志信息保存下来并提供api给前端查看。日志表结构这是数据库的其中一张数据表，我将请求日志信息保存在这，方便管理员可以查看。创建生成日志的中间件//app.js// 日志app.use(async (ct

有人抽中过有用的东西吗🤔

记录一下“双十一“哈哈哈

记录六 Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——服务端图片上传与下载 https://blog.csdn.net/Smell_rookie/article/details/108886254?utm_source=app 一键三连一下呗

发布Blink于 6 月前

[记录六]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——服务端图片上传与下载

本项目需要涉及前端上传图片与显示图片，为此自己实践一下图片相关的东西，挺有意思所以就分享出来。实现思路：服务端的处理方式是将前端上传的文件保存在服务端本地，然后重命名该文件名字，再将图片在服务端的路径存入表中，前端请求图片地址的时候去服务端找出文件并返回给前端显示。在routes文件夹下新建一个common.js文件//common.js//导入所需模块const router = require('koa-router')()const api = require('../controller

国庆去哪玩好？有一起组队的吗？

我用#CSDN#这个app发现了有技术含量的博客，小伙伴们求同去《[记录五]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——使用swagger自动生成接口文档》, 一起来围观吧 https://blog.csdn.net/Smell_rookie/article/details/108807568?utm_source=app

发布Blink于 6 月前

[记录五]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——使用swagger自动生成接口文档

因为我们是异地对接接口文档，为此有对接文档是非常必要的，经过对比我选用swagger，但是node使用swagger有很多坑（细节）需要注意，我花费了两天时间才将文档展现出来，尤其是对注释部分需要严格按照格式去写。我这里选用swagger-jsdoc和koa2-swagger-ui去实现。首先我们在routes文件夹中另起一个文件swagger.js，为什么在routes文件下呢？因为在给到别人看文档的时候你是打开127.0.0.1:300/swaggger这样的网址的，所以它相当于node的其中一个路

Vue中移动端使用postcss-px2rem和lib-flexible解决自适应

前端页面移动端免不了需要自适应高度宽度字体大小等等，如果直接写rem的话那会很麻烦，前端还需要根据设计图自己去转rem写样式，那样会非常麻烦且不易维护。本文将介绍前端写px像素单位自动转为rem单位。添加依赖postcss-pxtoremyarn add postcss-pxtorem 或 nmp install postcss-pxtorem添加依赖lib-flexibleyarn add lib-flexible 或 npm install lib-flexible在package.j

前端可以了解下token的使用 [记录三]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——token校验登录态 https://blog.csdn.net/Smell_rookie/article/details/108704245?utm_source=app

发布Blink于 7 月前

[记录四]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——token控制接口权限

上节我们已了解后端是如何将数据加密成token以及如何解密回用户数据的，但是并没有做到用户没有登录就不可以请求某个接口（需要用户信息的api），这样不控制的话就直接请求那就会报错了，当然为了安全是肯定要对大部分接口进行登录后才能调用的控制的。这里我采用中间件去控制。在utils文件夹下新建一个whiteList.js文件这里就写免登录的接口路由，这些是客户端不传登录态token也是可以调用成功了，后面需要不登录就能调用接口就直接在这个数组后面加多个接口的路由。在app.js中编写一个中间件，根据上面

新鲜出炉还热乎的 [记录三]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——token校验登录态》, 一起来围观吧 https://blog.csdn.net/Smell_rookie/article/details/108704245?utm_source=app

发布Blink于 7 月前

[记录三]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——token校验登录态

项目中凡事涉及到用户登录注册的都需要一个登录态来验证用户的登录状态，常用的登录台无外乎是token、session啊这些标识。这里我使用的是token字段。token一般会包含用户的个人信息，如：账号、账号id、用户名等等，更为安全的是加入一个自定义的盐(salt)一起加密，防止用户信息泄漏。下面就一起来使用一下：说到token，肯定会想到后端是怎么知道前端给我的token是不是我传给他的有效值呢？就是说后端需要有个值去跟前端传过来的token进行比较才知道合法性。所以后端在生成token的同时自己也需要

在写node的朋友可以了解下 [记录二]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——编写接口路由》 https://blog.csdn.net/Smell_rookie/article/details/108626871?utm_source=app

发布Blink于 7 月前

[记录二]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——编写接口路由

前言写这个项目需要用到很多的依赖，node导入依赖也很方便，直接：let mysql=require('mysql')以下是我做这个项目使用到的依赖：后面都会一一来使用和介绍。编写接口编写接口之前需要配置数据库和写一个处理sql语句的方法。在controllers文件夹下新建defaultConfig.js和mysqlConfig.js。//defaultConfig.jsconst config = { // 数据库配置 database: { DATABASE:

[记录一]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——前期准备

前言：最近在开发一款小程序以及配套的后台管理系统，主要是想改变一下自己对后端的无知。考虑到开发的成本就选用了适合前端人的服务端开发语言node.js。此博客会一直更新到这个项目的结束以及在生产环境上遇到的问题的总结，纯属个人的锻炼技术。开发环境前期准备：1、下载集成环境（⚠️下载它的最新版避免踩坑。）。MxSrvs集成软件：它减少了配置和需要下载多个文件的烦恼（我是这么想的）已经自带Nginx+redis+mysql必备的开发工具了。2、安装node+koa2开发环境（具体的安装教程请百度，网

有大佬用过swagger-jsdoc和koa2-swagger-ui吗

发布Blink于 7 月前

试着写写后端发现还是很有意思的加油＾０＾~👏

造起来

打卡react学习

奥利给实话说我想涨粉丝了😜支持一下?

有东莞的前端大佬吗？一起打卡啊

Smell_rookie的博客

免费送！素材库网站会员兑换码

element的el-table列标题添加自定义图标

vue+element使用sortable拖拽实现行排序

CSDN花里胡哨的自定义模板

程序员祝福拜年网页（纯js+html）

人人都可免费定制微信红包封面，无需审核！

集齐支付宝福卡秘籍来了！

基于ElementUI的el-upload组件二次封装

CSDN会员免费拿，实现CSDN会员自由的机会到了！！！

vue搭建的服装类商城手机模板

python京东茅台脚本.zip

新年烟花代码(纯js和html)

回看2020在前端路上的经历

[记录九]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——在服务器清除小程序上传的废弃图片

个人开发者的小程序

爬取线上小程序源码看这一篇就够了！

做自带流量的微信小程序，看这一篇就够了

小程序接入vant Weapp组件的详细步骤

h5购物车功能实现里程碑祭奠1024

项目中总会用到的方法，即开即用（持续更新ing）

基于php的酒店预订信息管理系统（自动化管理）

[记录八]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——使用定时任务执行脚本

[记录七]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——生成请求日志

[记录六]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——服务端图片上传与下载

[记录五]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——使用swagger自动生成接口文档

Vue中移动端使用postcss-px2rem和lib-flexible解决自适应

[记录四]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——token控制接口权限

[记录三]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——token校验登录态

[记录二]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——编写接口路由

[记录一]Vue+node+koa2+mysql+nginx+redis，全栈开发小程序和管理员管理系统项目——前期准备

vue中导出报表并兼容客户端的方式

基于php的校园失物招领平台系统（自动化匹配招领启事）

Mac的MxSrvs切换php版本报错解决方案

小程序底部弹起组件化与插槽案例

你想要的js正则表达式都在这！

element中table组件根据属性合并行数据

vue-devtools调试工具导入浏览器简单教程

可以直接安装的vue-devtools调试工具.zip

将后台数据转化为符合el-tree组件的结构

认识可选链和双问号语法

小程序实现索引栏遇到的坑

element的日期选择器el-date-picker分开的日期约束

前端请求接口的几种方式总结