蒋川@卡拉云_个人页

2022年08月

• 08.31 20:16:22
  发表了文章 2022-08-31 20:16:22

  低代码是什么？国内排名前 5 的低代码开发平台对比

  低代码是一套可视化开发工具，它帮开发者把前后端基础功能写扎实，开发者只需要通过填表配置或拖拽生成前端组件的方式，即可完成后台管理系统的快速搭建。由于低代码仍需要写少量 JS 代码，所以低代码开发平台主要面向程序员，帮助程序员敏捷开发。本文使用企业级低代码开发平台「卡拉云」举例说明，什么是低代码开发平台。低代码卡拉云把后台管理系统（CRM、ERP、CMS、MES等），拆分抽象成三部分。「前端组件」+「后端数据」+「连接前后端的简单 JS 代码」

  
• 08.31 17:52:07
  发表了文章 2022-08-31 17:52:07

  React useReducer 终极使用教程

  useReducer 是在 react V 16.8 推出的钩子函数，从用法层面来说是可以代替useState。相信前期使用过 React 的前端同学，大都会经历从 class 语法向 hooks 用法的转变，react 的 hooks 编程给我们带来了丝滑的函数式编程体验，同时很多前端著名的文章也讲述了 hooks 带来的前端心智的转变，这里就不再着重强调，本文则是聚焦于 useReducer 这个钩子函数的原理和用法，笔者带领大家再一次深入认识 useReducer。

  

2022年07月

• 07.12 17:32:53
  发表了文章 2022-07-12 17:32:53

  React Table 表格组件使用教程 排序、分页、搜索过滤筛选功能实战开发

  在日常开发中，特别是内部使用的后台系统时，我们常常会需要用表格来展示数据，同时提供一些操作用于操作表格内的数据。简单的表格直接用原生 HTML table 就好，但如果要在 React 中实现一个功能丰富的表格，其实是非常不容易的。在本站之前的文章《最好的 6 个 React Table 组件详细亲测推荐》 中有提到过 react-table 这个库，如果对这个库不太了解的同学可以先了解一下，这里不再赘述。简而言之，react-table 是一个非常强大的库，它与常见的表格组件不同，它不负责渲染 HTML 和 CSS，而是提供了一系列的 hooks 让我们可以灵活地构建功能强大的表格组件。

  

2022年06月

• 06.08 20:54:52
  发表了文章 2022-06-08 20:54:52

  在 Vue3 + Element Plus 中生成动态表格，动态修改表格，多级表头，合并单元格

  在 Vue 中，表格组件是使用频率及复杂度排名第一的组件，前端经常需要根据后台返回的数据动态渲染表格，比如动态表格如何生成，因为表格的列并不是固定的，在未知表格具体有哪些列的场景下，前端如何动态渲染表格数据。又或者需要把表格单元格进行合并处理，比如第一列是日期，需要把相同的日期进行合并，这样表格看起来会更加清晰。 本文手把手教你如何在 Vue3 + Element Plus 中创建表格、生成动态表格、创建动态多级表头、表格行合并、列合并等问题。如果你正在搭建后台管理工具，又不想处理前端问题，推荐使用卡拉云 ，卡拉云是新一代低代码开发工具，可一键接入常见数据库及 API ，无需懂前端，仅需拖拽即

  
• 06.04 10:10:50
  发表了文章 2022-06-04 10:10:50

  5款 React 实时消息提示通知(Message/Notification)组件推荐与测评

  React 消息提示通知组件（Message / Notification）是我们日常开发中经常使用的组件，它可用作与用户交互的反馈提示，信息提交成功、错误、操作警告等场景使用。原生JavaScript 提供了alert、prompt、confirm 等方法，这三个方法的不支持定制化，使用场景严重受限，特别是 alert 在浏览器外弹窗，体验非常糟糕。因此要想给用户提供良好的使用体验，我们需要封装一个定制化较好的 React 消息提示组件，这种组件看似简单，但也存在非常多深坑要小心，例如遮罩层、消失时间、点击事件的冒泡处理等。我自己在开发和研究 Message / Notification 功

  
• 06.01 16:45:45
  发表了文章 2022-06-01 16:45:45

  顶级好用的 React 表单设计生成器，可拖拽生成表单

  React 前端开发中，表单组件是排在前三的高频使用的组件，如何快速构建表单，节省力气，避免重复造轮子呢，选择一款适合自己的前端表单设计生成器就非常重要了。本文介绍 3 款顶级好用的 React 表单设计器，其中最后一款卡拉云，是新一代低代码开发工具，不仅能自动生成各类表单，还可以拖拽生成其他常见的前端组件，一行代码连接前后端数据，可快速接入数据库/api。它是表单设计器的超集，可直接生成属于你的后台管理工具，无敌好用。
• 06.01 10:14:56
  发表了文章 2022-06-01 10:14:56

  最好用的 5 个 React select 多选下拉菜单组件测评推荐

  在 React 开发中，单选 / 下拉 / 多选（select）功能使用非常普遍，React select 除了用鼠标点选外，还可以有更多样的功能，比如搜索过滤，树状结构，tab 分组，按组选择等。这些高级功能都可以在第三方组件中找到，本文记录了我自己使用多年最好用的 6 款 React select 多选下拉组件，每一款都经过我实际测试，推荐给大家。如果你正在搭建后台管理工具，又不想处理前端问题，推荐使用卡拉云，卡拉云是新一代低代码开发工具，可一键接入常见数据库及 API ，无需懂前端，仅需拖拽即可快速搭建属于你自己的后台管理工具，一周工作量缩减至一天，详见本文文末。

  

2022年05月

• 05.30 17:28:07
  发表了文章 2022-05-30 17:28:07

  Vue3 Typescript + Axios 全栈开发教程：手把手教你写「待办清单」APP

  Vue3 的源码使用 TypeScript 编写，而 TypeScript 是 JS 的一个超集，主要提供对 ES6 的支持，以及更棒的代码可读性和高维护性。Axios 是基于 Promise 的 HTTP 请求库，它用在 node.js 和浏览器里，在本教程中我们使用 Vue3 Typescript 配合 Axios 通过 Get / Post / Put / Delete 请求与后端通讯。本文通过手把手教你写一个前端「待办清单」app，带领大家详细理解 Vue3 Typescript 与 Axios 如何配置及如何与后端通讯，助你成为 Vue3 Typescript 与 Axios 全栈开

  
• 05.30 16:37:28
  发表了文章 2022-05-30 16:37:28

  React 实现 PDF 文件在线预览 - 手把手教你写 React PDF 预览功能

  在 React 项目中，很多场景都需要 PDF 文件预览功能，比如合同 ERP，销售CRM，内部文档 CMS 管理系统，都需要内置 PDF 文件在线预览功能。本文手把手教你搭建一套 PDF 预览组件嵌入到 React 项目中，实现 PDF 文件预览的所有常见功能。跟随本教程学习完成后，你会搭出以下 PDF 在线预览效果的 React PDF 预览组件

  
• 05.27 17:34:11
  发表了文章 2022-05-27 17:34:11

  Vue3 TypeScript 使用教程 - 实战 Vue3 element-plus 开发「待办清单」

  Vue3 的源码使用 TypeScript 全部重构，而 TypeScript 是 JS 的一个超集，主要提供对 ES6 的支持以及更棒的代码可读性和高维护性。可以说 Vue3 Typescript 已经成为开发标配。本文带领大家从搭建环境开始，手把手带领大家用 Vue3 Typescript + element-plus 开发一个极简「待办清单」app，在实战中学习 Vue3 TypeScript。如果你正在搭建后台管理工具，又不想处理前端问题，推荐使用卡拉云 ，卡拉云是新一代低代码开发工具，可一键接入常见数据库及 API ，无需懂前端，仅需拖拽即可快速搭建属于你自己的后台管理工具，一周工作

  
• 05.27 16:11:28
  发表了文章 2022-05-27 16:11:28

  React Echarts 使用教程 - 如何在 React 中加入图表（内附数据看板实战搭建案例）

  Ehcarts 作为数据展示的组件，应用场景丰富，所以在 React 里引入 Echarts 图表是每个前端必会技能。而 Echarts配置项多且复杂，每个配置项都会细分很多个配置小项，并且还对外暴露了一套 API，包括图表实例，事件监听等，还是有一定的上手难度。本文手把手教大家如何在 React 里使用 Echarts，并结合实际使用场景，分享我是如何处理图表自适应等具体问题。 最后来一个实战教学，教大家如何结合 ant-design React UI 框架，开发企业级的「数字币走势数据看板」，帮助大家加深对 Echarts 的理解。

  
• 05.25 17:13:35
  发表了文章 2022-05-25 17:13:35

  7 款最棒的 React 移动端 UI 组件库 - 特别针对国内使用场景推荐

  优秀的 React UI 移动端组件库和模版框架，帮我们节省开发时间，提高开发效率，统一设计语言。更棒的是内置的功能复杂，我们自己很难处理的常用组件，比如表格、表单、富文本编辑器、时间日期选择器、实时拖拽组件等，再进一步，还有帮我们把组件的轮子装好的 React admin 后台管理系统。本文推荐 7 款适用于中文使用者习惯的开源 React 移动端 UI 库，特别针对国内使用场景推荐。
• 05.24 17:26:08
  发表了文章 2022-05-24 17:26:08

  7 款最棒的开源 React UI 库测评 - 特别针对国内使用场景推荐

  优秀的 React UI 组件库，帮我们节省开发时间，提高开发效率，统一设计语言。更棒的是内置的功能复杂，我们自己很难处理的常用组件，比如表格、表单、富文本编辑器、时间日期选择器、实时拖拽组件等，再进一步，还有帮我们把组件的轮子装好的 React admin 后台管理系统。本文推荐 7 款适用于中文使用者习惯的开源 React UI 库，特别针对国内使用场景推荐。

  
• 05.23 16:55:40
  发表了文章 2022-05-23 16:55:40

  多款顶级好用的 Vue 表单设计器测评推荐，可拖拽生成表单

  Vue 前端开发中，表单组件是排在前三的高频使用的组件，如何快速构建表单，节省力气，避免重复造轮子呢，选择一款适合自己的前端表单设计器就非常重要了。本文介绍 4 款顶级好用的 Vue 表单设计器，其中最后一款卡拉云，是新一代低代码开发工具，不仅能自动生成各类表单，还可以拖拽生成其他常见的前端组件，一行代码连接前后端数据，可快速接入数据库/api。它是表单设计器的超集，可直接生成属于你的后台管理工具，无敌好用。

  
• 05.22 21:26:02
  发表了文章 2022-05-22 21:26:02

  最好用的 8 款 React Datepicker 时间日期选择器测评推荐

  React 时间日期选择器（date-timepicker）组件,与表单、富文本、表格、拖拽等组件一样，是大家用 React 搭建项目时使用最频繁的组件之一。React DateTimePicker 除了基础选择日期时间外，还有非常多样的功能配合不同场景使用，比如 12/24小时，禁止选择某些日期，高亮某些日期，夜间模式，多语言，酒店订单的特别场景等。本文记录了我自己使用多年最好用的 8 款 React DateTimePicker 组件，每一款都经过我实际测试，推荐给大家。

  
• 05.20 22:28:03
  发表了文章 2022-05-20 22:28:03

  Vite 与 Vue Cli 对比 - 尤雨溪: Vite 会取代 vue-cli 吗？

  尤雨溪在发布 Vite 之后写了一条推，感觉不会在用 webpack 了（Vue-cli 基于 Webpack 开发，并配置了 Webpack 打包规则），Sean 是 Webpack 核心开发者，会一些中文，在尤大这条下面直接感叹。Vue-cli 一直是 Vue 2 默认官方脚手架工具，Vue-cli 基于 Webpack 开发。Vue 3 发布后，尤大同时发布了 Vite ，那么 Vue 3 同时有两个前端打包工具 Vite 和 Vue CLI，那么他们俩应该怎么选呢？