- 博客(328)
- 资源 (11)
- 问答 (1)
- 收藏
- 关注
RSS订阅
原创 一个超简单的接口 Mock 工具升级版介绍，各位前端同学记得收藏哦！
一个超简单的接口 Mock 工具升级版介绍，各位前端同学记得收藏哦！这是一个我自己发起的项目，Github 地址是 https://github.com/fengcms/simple-mock ，其完整支持 RESTFul 接口的 Mock 服务。当然，支持非 RESTFul 风格接口也不在话下，关键是使用十分简便。我在接口演示文件里面，演示了 RESTFul 标准写法、分页列表、上传文件、登录接口等等多种。通过简单配置，还可以支持校验登录状态。此外，还支持将其它的接口代理过来使用。我本着最不需要额
2020-05-21 17:06:44
1193
原创 linux 或 mac 命令行更优雅的使用 curl 命令，以及命令行常用的快捷键说明
linux 或 mac 命令行更优雅的使用 curl 命令，以及命令行常用的快捷键说明最近看了一下我的博客的访问统计，作为一个前端博主，没有想到我阅读量最高的一篇博文居然是介绍如何在命令行使用 curl 命令的文章《curl 模拟 GET\POST 请求，以及 curl post 上传文件》。这实在是太让我惊讶了，看来大家对于命令行的使用还是有很多需求的。因此，我这里这篇文章，如果能让各位看官...
2020-04-27 17:08:10
2969
1
原创 next.js 如何配置接口代理 proxy
next.js 配置接口代理 proxy最近有一个小项目，打算使用 next.js 框架来做。这是我第一次使用该框架，没有太多的经验。按照官方的方法，初始化好项目，然后就能跑起来了。但是，我需要配置一下代理，用以请求数据，百度了一下，搞不起来，可能是因为资料版本比较老旧的原因。在 google 上搜索了一下，顺利解决了这个问题。因此撰文记录一下。安装所需依赖npm install express http-proxy-middleware -D有 nodejs 基础的话，可以看到，这两个依赖是非
2021-08-04 12:49:48
4283
2
原创 基于 TS 的 React 模板项目，集成 eslint sass，采用 StandardJS 代码风格，包含自动注册组件等各项功能，新建项目或 React 学习必备
react-typescript-sass-standard-template项目简介由于 Create React App 脚手架创建的项目过于简陋，没有集成诸如 eslint 等工具，致使每次在开发 react 项目的时候，就要颇费一番周折。针对这种不便，我搞了这个模板仓库。仓库地址：https://github.com/fengcms/react-typescript-sass-standard-template我的构建思想css 和 js 分离。我很不喜欢在 js 中写 css。所以，我
2021-05-15 15:24:25
847
原创 CentOS 8 配置 authorized_keys 免密登录后，免密登录失败的排查以及最终的解决
CentOS 8 配置 authorized_keys 后，登录失败的排查以及最终的解决安装好系统后，照例新增了 /root/.ssh/authorized_keys 文件，并将我的公钥粘贴进去，然后就准备免密登录了。但是，告诉我，要输入密码-_-|||我嘞个娘亲哎，这么多年，第一次遇到这种情况。于是开始排查。首先根据网上的说法，排查了文件的权限，然后发现，木有问题。。没办法了，我重新配置 /etc/ssh/sshd_config 文件，将日志调整为 DEBUG 模式LogLevel DEBUG
2021-03-24 17:16:41
2416
1
原创 CentOS8 安装时，如何配置安装源
CentOS8 安装时，如何配置安装源今天临时需要跑 CentOS 系统，于是在 http://mirrors.163.com/centos/8.3.2011/isos/x86_64/CentOS-8.3.2011-x86_64-boot.iso 地址，下载了一个基础镜像文件，然后在虚拟机软件中进行安装。安装过程中，发现不少问题。如下图首先，我们点击网络和主机名，进去打开网络。再点击左上角的完成，退出来可以看到，网络问题已经解决了。然后点击 安装目的地直接点击右上角完成，回到配置页面，可
2021-03-24 17:03:32
29148
9
原创 Linux\Mac 递归移除某文件夹下所有文件（不包含文件夹）的执行权限命令
今天别人给了我传了一个文件夹，里面是一个项目代码。我查看了一下，发现所有文件都是有执行权限的。这让我很不爽，于是我将所有文件（不包含文件夹）的执行权限全部去掉。执行命令如下：find . -type f -exec chmod -x {} \;命令很好理解，前面的 find . -type f 是找到当前文件夹下的所有文件（不包含文件夹）。如果是要找到所有的文件夹，则是 find . -type d-exec 是将前面找到的结果执行一个命令。chmod -x 是移除执行权限，如果是要增加执行权
2020-05-28 16:05:06
1387
转载 【转载】vue 3.x 如何有惊无险地快速入门 —— 一文扫遍 vue2 与 3 的差异点
【转载】vue 3.x 如何有惊无险地快速入门 —— 一文扫遍 vue2 与 3 的差异点前言本文所分享的是关于 vue 3.x 在用法上的改变，而不是在代码实现上的不同。虽然 vue2 到 vue3 的实现大改，但在用法上变化基本不大，比较明显的一个变化就是添加了 setup(){} 函数了，几乎所有的配置变成了以函数的方式进行定义。即使是这样，但小改动还是很多的。本文主要分享的是 vue 2.x 与 vue 3.x 之间一些常见用法的差异。虽然记录的不多，但也不算少。本文资料来源：github.c
2020-05-24 16:49:39
2379
原创 vue3.0 Composition API 上手初体验 vue组件的具名插槽 slot 的变化
vue3.0 Composition API 上手初体验 vue组件的具名插槽 slot 的变化在我讲 vue 3.0 的普通组件的内容里，我提到了具名插槽发生了变化，我当时不清楚新的如何使用。今天查看了一些资料，终于搞明白了。搞一个带具名插槽的子组件直接撸代码：<template> <table> <tr> <th>默认插槽：</th> <td><slot /></td&g
2020-05-19 15:32:17
3520
2
原创 vue3.0 Composition API 上手初体验 用路由循环，做个导航菜单
vue3.0 Composition API 上手初体验 用路由循环，做个导航菜单通过前文的讲述，我已经基本讲清楚了 vue 3.0 的新特性，以及开发使用方法。只是演示 Demo 搞了好几个页面，只能输入地址进行跳转让我不爽，于是，我给我的 Demo 代码搞了个菜单，这里，我把这部分内容讲述一下。重构 src/router/index.js 文件在原来编写的代码中，我给单条路由只写了 path 和 component 两个参数，这里，我们加上 meta 参数，并为其设置 title 属性。相关代码如
2020-05-19 12:04:14
2475
1
原创 vue3.0 Composition API 上手初体验 函数组件的开发与使用
vue3.0 Composition API 上手初体验 函数组件的开发与使用在上一节中，我们讨论了普通组件的开发与使用，其实相比较 vue 2.0 来说，差别并不大。vue 3.0 的 Composition API 带来的最大的特性，就是函数组件。通过函数组件，我们可以体会到 类似 react 编程的愉悦。这个章节，我们就来讨论一下。在 vue 2.0 中，当多个页面或组件使用到相同逻辑的时候，我们会使用 mixin 来编写逻辑。其实我个人在使用 mixin 时，感觉还是很方便的，但是当项目组的其
2020-05-19 10:20:03
2776
原创 vue3.0 Composition API 上手初体验 普通组件的开发与使用
vue3.0 Composition API 上手初体验 普通组件的开发与使用通过前面的章节的讲解，我相信大家对于 vue 3.0 的新特性的基本使用，已经没有问题了。但是新的问题来了，组件是怎么玩的呢？这一讲，我们就来讨论一下，组件的开发与使用。写一个 button 组件首先，我们来创建一个按钮组件的文件# 进入项目文件夹cd ~/Sites/myWork/demo/vue3-demo# 创建组件文件夹mkdir -p src/components# 创建按钮组件touch src/c
2020-05-19 10:18:57
2921
8
原创 vue3.0 Composition API 上手初体验 神奇的 setup 函数 (四) 计算属性 computed
vue3.0 Composition API 上手初体验 神奇的 setup 函数 (四) 计算属性 computed上一讲中，我们讲解了 vue 3.0 的生命周期，我相信大家已经了然了。在 vue 中，计算属性 computed 是非常常用的。那么，在 vue 3.0 中，计算属性是如何使用的呢？这一讲我们来着重讨论，。上代码！首先，我们新建 src/views/Computed.vue 文件，并在路由中设定路由为 computed。不会操作的看上一讲的演示。然后编写如下代码：<temp
2020-05-19 10:17:18
4816
原创 vue3.0 Composition API 上手初体验 神奇的 setup 函数 (三) 生命周期函数
vue3.0 Composition API 上手初体验 神奇的 setup 函数 (三) 生命周期函数通过前面两讲，我相信大家对于 vue 3.0 双向绑定数据，已经有了一些了解了。但是，对于生命周期函数，还是一脸懵逼的。这一讲，我们来讲解生命周期函数。vue 2.0 生命周期对比 3.0 生命周期2.0 周期名称3.0 周期名称说明beforeCreatesetup组件创建之前createdsetup组件创建完成beforeMountonBeforeM
2020-05-19 10:15:49
6056
原创 vue3.0 Composition API 上手初体验 神奇的 setup 函数 (二) 响应对象数据的绑定
vue3.0 Composition API 上手初体验 神奇的 setup 函数 (二) 响应对象数据的绑定上文中，我们已经了解普通响应数据的绑定了。但是，那只是普通数据，我们在实际开发中，用到的对象数据是最多的。这一讲，我们就来讲讲响应对象数据的绑定。开干。编辑 src/views/About.vue 文件编写代码如下：<template> <router-link to="/">点这里去首页</router-link> <hr> &
2020-05-19 10:14:15
2358
原创 vue3.0 Composition API 上手初体验 神奇的 setup 函数 (一) 响应数据的绑定
vue3.0 Composition API 上手初体验 神奇的 setup 函数 (一) 响应数据的绑定从网上大家对于 vue 3.0 的最大的变化，就是 Vue Composition API 的看法来说，两极分化比较严重。一种是认为这种写法实在太优秀了，很好，很喜欢。另外一种则认为变得没有以前那么清晰了，增加了学习成本。那么我是怎么认为的呢？当然是第一种想法啊！你可知道，曾经我一度感觉到 vue 的语法实在是太过于变态，进而放弃使用 react 开发一年有余。后来因为来上海，入职的公司都是 vue
2020-05-19 10:12:49
7248
2
原创 vue3.0 Composition API 上手初体验 使用 vue-router 构建多页面应用
vue3.0 Composition API 上手初体验 使用 vue-router 构建多页面应用前两讲，我们已经顺利的使用 vue3.0 将项目跑起来了。但是实在是过于简陋，目前我们几乎不可能开发只有一个页面的应用。因此，vue-router 是必不可少的。这一讲，我们就来讲讲最新的 vue-router 配合 vue3.0 是如何玩的。首先，我们进入我们的项目目录，安装依赖。我的 demo 目录为 ~/Sites/myWork/demo/vue3-demo。本人为 MacOS 环境， Wind
2020-05-19 10:10:33
4650
3
原创 vue3.0 Composition API 上手初体验 构建 vue 基础代码
vue3.0 Composition API 上手初体验 构建 vue 基础代码上一讲中，我们通过配置 webpack 构建了一个基础的开发环境。但是并没有涉及到 vue3.0 的内容，这一讲中，我们来构建一些基础代码。首先，在终端中进入到我们的项目目录，我的 demo 目录为 ~/Sites/myWork/demo/vue3-demo。本人为 MacOS 环境， Windows 环境请自行将一些命令转换成你习惯的操作。比如在文件夹中操作，或在 vscode 等编辑器中操作。创建基础文件# 进
2020-05-19 10:08:41
1892
原创 vue3.0 Composition API 上手初体验 构建基本项目开发环境
vue3.0 Composition API 上手初体验 构建基本项目开发环境目前，vue3.0 已经进入了 beta 版本了。众多的特性已经定下来了，相信有不少朋友都已经开始阅读相关的资料或源码了。虽然我现在工作比较劳累，但是对于这样的前端行业的盛事，我也不能袖手旁观哪！所以，我决定写一个系列的文章，来带大家上手一下全新的 vue3.0。首先，从目前公开信息来看，vue3.0 是完全兼容 2.0 版本的所有写法的。因此，即便不了解 3.0 的内容，用原有的知识储备，也是完全可以使用 3.0 版本的。
2020-05-19 10:06:42
3641
3
原创 mac 下使用 iTerm 终端工具无法使用 alt+b 和 alt+f 快捷键的解决办法
mac 下使用 iTerm 终端工具无法使用 alt+b 和 alt+f 快捷键的解决方法对于常在终端下工作的人来说，输入命令是家常便饭。但是当我们的命令输入错误的时候，需要调整就比较麻烦了。一般来说，不经过学习都知道，使用左右方向键可以在输入的字母上进行跳转。但是问题是，这样操作效率太低。因此，我们常用的命令有下面几个： 命令 解释 ctrl+a 跳转到命令最前面 ctrl+e
2020-05-19 09:06:57
1770
转载 ES6 解构赋值的详细说明，建议给为前端收藏！
ES6 解构赋值的详细说明，建议给为前端收藏！相较于常规的赋值方式,解构赋值最主要的是’解构’两个字,在赋值的过程中要清晰的知道等号右边的结构.先简单地看一下原来的赋值方式.var a=[1,2] 分析一下这句代码的几个点:(1)变量申明和赋值/* 你可以理解这两个操作是分开的,虽然是一句代码. 声明变量都会出现变量名的提升(也就是是声明变量的这句代码会被提升到生效作用域的...
2020-05-05 21:58:24
1221
原创 解决 CentOS 在 mariadb 数据库服务因某些原因自动关闭后，服务重启的配置方法
解决 CentOS 在 mariadb 数据库服务因某些原因自动关闭后，服务重启的配置方法一台运行数年的 centos 服务器，发生了一次 解决 mariadb 服务自动关闭的情况。我当时不以为意，直接运行 systemctl start mariadb.service 命令，重启了服务。但是又过去了几个月，这玩意儿又自动关闭了。不清楚是啥原因，但老这样不是个事儿呀，虽然几个月才发生一次，但是...
2020-04-27 11:35:08
1651
原创 一个超简单的 RestFUL API 接口 Mock 工具，建议各位前端同学来使用哦！
一个超简单的 RestFUL API 接口 Mock 工具，建议各位前端同学来使用哦！在我们前端的开发工作中，如果与后端做好了前后端并行开发的安排，那么我们肯定是少不了使用 Mock 工具的。作为前端同学对于网上流行的各种 Mock 工具应该都有一些了解，但是这些工具要么太过于强大，使用它还得学习一下它是怎么玩儿的，比如著名的 mockjs 工具。要么过于简陋，比如网上各种5分钟开发一个 moc...
2020-04-07 11:56:14
3487
2
原创 动态生成 uniapp 配置文件 pages.json 的解决方案
动态生成 uniapp 配置文件 pages.json 的解决方案最近接手了一个基于 uniapp 的开发项目，我个人对于它能够使用同一套代码就能够开发 h5\app\小程序 的强大功能表示非常钦佩。但是其配置文件 pages.json 也让我十分郁闷，原因无他，只因其是写死 JSON 文件，在管理的时候是十分不便的。在搜索了一些资料，期望可以用 pages.js 文件来替代 pages.js...
2020-03-28 18:16:49
10500
12
原创 JS数组递归——构建 element 级联选择器树形数据
JS数组递归——构建 element 级联选择器树形数据通常，我们前端在开发管理后台的时候，会选择 vue+element 这样的技术栈去实现。但我们后端给的数据格式通常并不符合 element 的参数数据要求。比如，级联选择器 cascader 的参数数据格式如下：[{ "label": "第一级", "value": 2, "children": [{ "label": "第二级...
2020-02-20 17:57:05
4310
原创 超实用多选框 checkbox 功能——全选、不选、反选等功能的数据驱动 JS 实现
超实用多选框 checkbox 功能——全选、不选、反选等功能的数据驱动 JS 实现对多选框实现 全选、不选、反选 是一个常见的功能，尤其是在外面使用了 vue 或者 react 等前端框架之后，仅仅是需要数据处理，我相信各位朋友都已经烂熟于心了。但是我近日遇到一个需求，琢磨了一下实现了。我感觉这段代码有分享的价值，因此编撰此文，与诸君分享。了解需要实现的功能需求一图胜前言，我们来看下要实现...
2020-02-18 16:34:03
2424
原创 搜索引擎优化（SEO） 基础常识
搜索引擎优化（SEO） 基础常识前言在移动互联网迅猛发展的今天，各种APP、小程序满天飞，针对网页的搜索引擎优化（SEO）对于现今的企业来说已经不是头等重要的事情了。但是如果公司的SEO做得好的话，确实可以节约很大一部分宣传开支，因此，并不能说明它是完全没有作用的工作。只是在我看来，重要性确实下降了很多。本人从事搜索引擎优化方便的研究十余载，不敢妄言大成，但总还有些心得，因此编撰此文，以期博...
2020-02-17 22:24:03
3598
原创 javascript 商城结算页面选择今日或明日送货时间数组的实现
javascript 商城结算页面选择今日或明日送货时间数组的实现缘起今日在开发一个生鲜商城的项目，其中结算页面有一个需求。大概意思如下，后端会返回该店铺每日的营业时间，格式是 { startTime: '09.00', endTime: '21.00'} 这样的俩字段。前端要根据这俩字段来计算当天的和次日的送货时间段，以半个小时为间隔。其中的重点是如果当前时间大于开始时间，则要在输出的当天...
2020-01-07 15:15:06
1096
原创 JS判断数据类型以及数据过滤空值方法
JS判断数据类型以及数据过滤空值方法在我们的项目开发中，经常需要对一个传输中的数据进行滤空处理，过滤 null、undefined、''、[]、{}等，还要对字符串进行去除两端的空格操作。为此，我写了一个递归处理方法，代码如下：const toType = obj => { return ({}).toString.call(obj).match(/\s([a-zA-Z]+)/)[1...
2019-10-25 16:54:26
3237
1
原创 python 检查字符串中是否包含非中文字符的方法
今天写一段代码，需要校验字符串中是否包含非中文字符，于是百度了一下，结果让我十分震惊，那就是几乎第一页都是错误的演示代码。全是复制的某一个人的错误代码，这样的搜索结果，实在是让百度很难堪，也让我们中文的编程环境很难堪。下面是错误代码：def is_Chinese(word): for ch in word: if '\u4e00' <= ch <= '\u9...
2019-09-09 15:58:49
3959
原创 一段自动编译前端项目的Shell代码，如果没有上集成工具的话，略有小用。
临时构建一个前端项目的服务器，由于前端项目有十几个，每次git拉代码以及运行编译命令，搞得烦不胜烦。关键是，全是命令行操作，让其他人不太愿意操作。因此，写了这样一个脚本，便于操作，也可以用于后续的系统集成。前端项目都是 vue-cli 脚手架开发，统一由 git 进行代码管理，编译后的文件在源代码的 dist 目录，Nginx 已经配置指向这些目录，所以不需要额外的复制代码工作。如果有不需要的话...
2019-08-23 17:45:17
778
原创 修改 Linux 默认 Shell 用 chsh -s /bin/zsh 命令不生效，提示 chsh: Shell not changed. 或 chsh: command not found 怎么办
我想现在应该有很多人都已经使用zsh作为默认的Shell了，尤其是搭配 oh-my-zsh 之后，真是好用得飞起。一般，我们在切换系统默认的Shell的时候，都会使用 chsh -s /bin/zsh 命令来进行修改。今天我遇到一个问题，在某台老服务器上，使用这个命令无法修改，具体原因未知。始终提示——chsh: Shell not changed.无奈，只能更换另外的切换方式了，改用 use...
2019-08-13 16:52:11
21317
3
原创 常用 git 命令以及处理技巧
常用 git 命令以及处理技巧基础常用命令# 克隆git clone git@github.com:fengcms/fengcms.git# 拉git pull# 添加某一个文件git add "src/xxx.js"# 添加所有文件，严禁使用 `git add .` 这样的命令！这完全是不同的含义！git add -A# 暂存——通过 vim 编辑器git comm...
2019-07-15 13:34:31
1398
1
转载 【转】指定文件、指定行、指定代码块不使用 ESLint 语法检查
指定文件、指定行、指定代码块不使用 ESLint 语法检查在使用了 eslint 进行代码检查后，可以大幅提高我们的代码规范。但是，在某些情况下，我们必须去写一些违反规则的代码。如果写了这些代码，则势必会导致各种提示报错。这种情况下，如果不去处理，则会导致项目警告越来越多，最终不知道哪些是必须的，哪些是可以修正的。因此，在某些地方，禁用检查就变得十分重要了。随便搜索了一下，找到了这篇博文，写得...
2019-05-28 12:12:11
2175
原创 deepin 安装 vscode 编辑器之后，默认文件管理器变成 vscode 的解决方法（deepin 重置文件管理器）
deepin 安装 vscode 编辑器之后，默认文件管理器变成 vscode 的解决方法（deepin 重置文件管理器）如果你不明白我在说什么，肯定你是没有遇到这个问题，如果你遇到了这个问题，自然知道是怎么回事儿。解决方法，执行以下命令：xdg-mime default dde-file-manager.desktop inode/directory参考资料：https://www...
2019-05-05 13:35:08
1595
原创 最近工作调动，回到上海了，所以没时间更新博客，希望大家体谅～
兰州实在是呆不住了，所以回到上海来工作了，刚参与这边工作，事情比较多，所以没时间更新博客。不过最近有学习到很多新东西，我会在有时间的时候进行整理，然后分享给大家的。...
2019-04-08 09:42:42
721
7
原创 React 脚手架 create-react-app 新版使用说明 重点是配置代理
React 脚手架 create-react-app 新版使用说明 重点是配置代理近期更新了一下 create-react-app 工具，然后发现，和原来的老版本使用出现了略微的差异。比如原先想要处理 sass 还需要去手动配置 webpack 但是新版里面已经集成了。此外，代理的配置也完全不一样了。因此，如果是看我之前的 react 简明教程的话，是会出现一些不一样的地方的。因此，我重新来整理...
2018-12-07 16:14:07
7390
原创 Python 打造基于有道翻译的命令行翻译工具（命令行爱好者必备）
Python 打造基于有道翻译的命令行翻译工具（命令行爱好者必备）之前基于百度写了一篇博文 Python 打造基于百度翻译的命令行翻译工具，本来这工具用得挺好的。但是没想到，近期处于不知道啥原因，不能用了。破解人家的接口难免会有这样的情况发生，也不能怪人家百度对吧。加上最近工作比较忙，所以也没有去再研究，今天正好有点时间，我就打算重新写一个命令行的翻译工具。想来破解人家的是不对，不如使用人家提...
2018-09-20 15:08:25
5641
7
原创 TNT 初步试用体验报告
TNT 初步试用体验报告已经购置了绿联 type-c 的拓展坞，配合我的蓝牙键盘鼠标，今天终于顺利的尝试了 TNT 系统。就目前的完成度来说，远远超出了我的想象，但仍未达到可以长期使用的底部。说实话，开发 TNT 这样的全新交互的操作系统，我是不大相信锤子科技如此的体量可以在这么短的时间内有这么高的完成度的。就目前来说， TNT 完全是一个可用的系统，而并非一个玩具。但是如果想要长期使用，...
2018-09-11 20:58:15
1960
转载 DeepinLinux 运行 React 项目出现 Error: watch ENOSPC 的解决方案
DeepinLinux 运行 React 项目出现 Error: watch ENOSPC 的解决方案今天给新来的前端同事安装了 DeepinLinux，然后在运行 React 项目的时候出现了 Error: watch ENOSPC 的报错。我很奇怪为什么会出现这个错误，随后找到了这篇文章，原文如下：Error: watch ENOSPC 的解决方案在 Fedora 和 Ubun...
2018-09-10 17:52:40
1482
1
让黑苹果系统，支持安卓手机分享USB网络 HoRNDIS-9.2
2020-09-01
黑苹果USB无线网卡驱动，适用于mac10.15.x的版本，祝大家好用！
2020-08-04
Sip 软件免费版，MacOS 下好用的屏幕取色软件
2020-05-03
黑苹果 Clover 引导编辑器 Mac 版本
2020-05-03
用于 MAC上卸载 Creative Cloud 的工具
2017-02-27
win10系统iis伪静态配置安装文件64位版
2015-12-17
文本替换专家2.5（无需注册版|非破解）
2015-11-24
FengFocus jQuery焦点图插件
2015-09-04
Sublime Text 3/64 精心调配版 by FungLeo
2015-08-26
移动端css文字使用什么单位最合适？
2015-08-26
TA创建的收藏夹 TA关注的收藏夹
TA关注的人