『拖放』这一类的行为存在着巨大的用户需求，例如构建网站（Wix）或交互式应用程序（Trello）。毫无疑问，这种类型的交互创造了非常酷的用户体验。如果再加上一些最新的 UI 技术，我们可以创建一些非常好的软件。 我想构建一个能让用户使用一系列可定制 UI 组件来构建布局的拖放布…

最近的项目里需要实现一个标签组件，内部标签可任意拖动排序。网上搜了一圈发现几乎没有现成的基于react的组件能很好的满足需求。 它很好用，最短只要几行代码；又很灵活，你可以进行添加、修改、删除、排序等操作，可以在一个标签里放任何东西，可以设置任何你想要的样式（该组件本身并不包含…

1. Decorator基本知识 在很多框架和库中看到它的身影，尤其是React和Redux，还有mobx中，那什么是装饰器呢。 修饰器（Decorator）是一个函数，用来修改类的行为。不是很理解这种抽象概念，还是看代码讲解实际些。 我们可以在外层套一个函数，只要最后返回的是…

本文会介绍如何写一个可拖拽日历组件，偏重点在于日历组件的功能挖掘以及对于开发过程的一些思考，编码部分会介绍核心部分的实现。代码在最后也会放出来给大家。 要做一个可拖拽日历组件，先得去看一圈市场上已有的日历组件做成什么样了。主要是为了收集功能以及避免重复造轮子。我调研了googl…

本系列涵盖了使用 React 的所有知识，分为上、中、下三篇。此为最后一篇。 本系列涵盖 React v16.9，但更多的是 React 全面解析，具体 React v16.9 新特性可查看 [译]React v16.9 新特性。 上篇主讲 React 元素渲染，可查看：深入解…

最近阿里正式开源的BizCharts图表库基于React技术栈，各个图表项皆采用了组件的形式，贴近React的使用特点。同时BizCharts基于G2进行封装，Bizcharts也继承了G2相关特性。公司目前统一使用的是ECharts图表库，下文将对3种图表库进行分析比对。 成…

使用 React.js 一段时间了，把使用过程遇到的小坑和小技巧记录下来，希望能够帮助到其他人。此文章是长篇大论你只有耐得住寂寞，禁得住诱惑才会有所成长。 1. 父组件向子组件通信 2. 子组件向父组件通信 3. 跨级组件通信 4. 没有嵌套关系的组件通信 下面demo中点击父…

频繁触发回调导致的大量计算会引发页面的抖动甚至卡顿。为了规避这种情况，我们需要一些手段来控制事件被触发的频率。就是在这样的背景下，throttle（事件节流）和 debounce（事件防抖）出现了。 这两个东西都以闭包的形式存在。 它们通过对事件对应的回调函数进行包裹、以自由变…

本文详细讲解了 react-dnd 的 API 以及用法，并且附上了可供参考的 Demo，希望能够给需要的朋友提供一下帮助。 React DnD 是一组 React 高阶组件，使用的时候只需要使用对应的 API 将目标组件进行包裹，即可实现拖动或接受拖动元素的功能。将拖动的事件…