在现代 web 开发中，React 是一个非常流行的框架，它提供了一种声明式的方式来构建用户界面。但是，有时我们需要直接操作 DOM 元素，这时候就可以使用 React-FNS-DOM-Elements 这个 npm 包。本文将介绍如何使用它。
React-FNS-DOM-Elements 简介
React-FNS-DOM-Elements 是基于 FNS 的一个 npm 包。它提供了一些原声 DOM 操作的 FNS wrappers，比如 addClassName、removeClassName、toggleClassName、setStyle、getBoundingClientRect 等。
此外，React-FNS-DOM-Elements 还提供了一些 React 组件，比如 LazyImage、ToolTip 等。
安装
使用 npm 安装 React-FNS-DOM-Elements：
npm install react-fns-dom-elements
使用示例
FNS Wrappers
-- -------------------- ---- -------
------ - ---------------- -------- - ---- -------------------------
-------- ------------- -
----- ------------ - ------------------
----- -------- - -----------
------------ -- -
-- ------ --- - ----- --- ----- --
--------------------------- -------
----------------------- - ---------------- ------ ---
-- ----
------ ---------- -------------
-LazyImage 组件
-- -------------------- ---- -------
------ - --------- - ---- -------------------------
-------- ------------- -
------ -
-----
--- ---- --- ---
---- ----------------------------------- ------------ ------ --
--- -- --------- -- ---
----------
-----------------------------------
------------ ------
-------------------------------------------------
--
------
--
-ToolTip 组件
-- -------------------- ---- -------
------ - ------- - ---- -------------------------
-------- ------------- -
------ -
-----
--- -- ------- -- ---
-------- ------------- -- - ------------- -- - ----------
------------- ------------
----------
------
--
-总结
React-FNS-DOM-Elements 是一个方便的 npm 包，它提供了一些原声 DOM 操作的 FNS wrappers 和 React 组件，让我们更轻松地直接操作 DOM 元素。在实际开发中，我们可以根据需要选择使用它提供的不同功能。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600575c181e8991b448ea70c