https://github.com/indatawetrust/preact-append-child
Simple and lightweight append child component for Preact
https://github.com/indatawetrust/preact-append-child
preact preact-components
Last synced: about 1 month ago
JSON representation
Simple and lightweight append child component for Preact
- Host: GitHub
- URL: https://github.com/indatawetrust/preact-append-child
- Owner: indatawetrust
- License: mit
- Created: 2018-07-29T11:32:15.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2018-07-29T18:28:17.000Z (almost 8 years ago)
- Last Synced: 2024-10-10T12:40:06.194Z (over 1 year ago)
- Topics: preact, preact-components
- Language: JavaScript
- Size: 5.86 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
- License: license
Awesome Lists containing this project
README
# preact-append-child
> Simple and lightweight append child component for Preact; for :atom_symbol: [Preact](https://github.com/developit/preact)
## But why?
To use the dom elements simply and quickly.
## Usage
for example [json-formatter-js](https://github.com/mohsen1/json-formatter-js)
```jsx
const { h, Component, render } = require("preact");
import JSONFormatter from "json-formatter-js";
import AppendChild from "preact-append-child";
class Demo extends Component {
constructor() {
super()
this.state = {
json: {
count: 0
}
};
}
componentWillMount() {
setInterval(() => {
this.setState({
json: {
count: ++this.state.json.count
}
})
}, 100)
}
render() {
let formatter = new JSONFormatter(this.state.json);
return (
);
}
}
render(, document.body);
```
[](https://codesandbox.io/s/3x3m6zo0wp)
## Install
```
$ npm install --save preact-append-child
```
```html
```
## Properties
#### child
Type: `Object`
#### afterAppend
Type: `Function`
#### beforeAppend
Type: `Function`
## License
MIT © [Ahmet Şimşek](https://github.com/indatawetrust)