What is rc-util?
The rc-util npm package is a collection of utility functions and components designed to be used with React components. It provides a set of tools to help with common tasks in React development such as DOM manipulation, event handling, and component management.
What are rc-util's main functionalities?
DOM manipulation
This feature allows you to get the scroll position of an element or the window. It is useful for handling scroll-related logic in your React components.
import { getScroll } from 'rc-util/lib/Dom/scroll';
const scrollPosition = getScroll(window);
console.log(scrollPosition);
Event handling
This feature provides a way to add and remove event listeners. It is particularly useful for setting up event listeners with the capability to easily remove them later, preventing potential memory leaks.
import { addEventListener } from 'rc-util/lib/Dom/addEventListener';
const removeListener = addEventListener(window, 'resize', () => {
console.log('Window resized');
});
// To remove the event listener
removeListener();
KeyCode utilities
KeyCode utilities provide a convenient set of constants for key codes, which can be used to improve the readability and maintainability of code that involves keyboard event handling.
import KeyCode from 'rc-util/lib/KeyCode';
const isEnterPressed = (event) => {
return event.keyCode === KeyCode.ENTER;
};
Other packages similar to rc-util
lodash
Lodash is a comprehensive utility library that offers a wide range of functions for tasks like array manipulation, object handling, and function utilities. It is more general-purpose compared to rc-util, which is more focused on React-specific utilities.
underscore
Underscore is another utility library similar to lodash, providing a range of functions for manipulating data structures and performing common JavaScript tasks. Like lodash, it is not specifically tailored to React.
rc-util
Common Utils For React Component
install
API
shallowEqual:function
KeyCode:enum
enum of KeyCode
KeyCode.ENTER
KeyCode.DOWN
guid:function
return string represent a global unique id across current application
createChainedFunction:function
Dom.addEventListener:function
Dom.contains:function
Children.toArray
transform React Children into Array type
License
rc-util is released under the MIT license.