https://github.com/patrickroberts/use-jquery-plugin
React hook for using jQuery plugins in components
https://github.com/patrickroberts/use-jquery-plugin
Last synced: 3 months ago
JSON representation
React hook for using jQuery plugins in components
- Host: GitHub
- URL: https://github.com/patrickroberts/use-jquery-plugin
- Owner: patrickroberts
- License: mit
- Created: 2020-05-10T23:34:14.000Z (about 5 years ago)
- Default Branch: master
- Last Pushed: 2023-01-26T19:58:58.000Z (over 2 years ago)
- Last Synced: 2024-04-26T03:20:41.828Z (about 1 year ago)
- Language: JavaScript
- Size: 474 KB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 11
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# use-jquery-plugin
React hook for using jQuery plugins in components
## About
`use-jquery-plugin` simplifies hook-based usage of jQuery plugins in React.
The hook `useJQueryPlugin()` is the same as [`useLayoutEffect()`], but it returns a reference object to be passed to an HTML element. The effect passed to `useJQueryPlugin()` is provided with the jQuery selection containing the HTML element that the reference is assigned.
## Install
### [npm] (Recommended)
```sh
npm i use-jquery-plugin
```
### [unpkg]
```html
```
## Usage
```js
import React from 'react';
import useJQueryPlugin from 'use-jquery-plugin';
export default function App() {
const elemRef = useJQueryPlugin($elem => {
$elem.find('h1').css('font-family', 'Comic Sans');
}, []);
return (
Hello, world!
);
}
```
## API Documentation
Available on [Github Pages].
[`useLayoutEffect()`]: https://reactjs.org/docs/hooks-reference.html#uselayouteffect
[npm]: https://www.npmjs.com/package/use-jquery-plugin
[unpkg]: https://unpkg.com
[Github Pages]: https://patrickroberts.github.io/use-jquery-plugin/