Skip to content

Simple Higher-Order Component for GunDB in React

Notifications You must be signed in to change notification settings

actuallydan/react-gun

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Notice

This repository is unmaintained due to my lack of time and due to not keeping up with Gun or using it in any of my projects.

React Gun

Simple Higher-Order Component for GunDB in React

Installation

Install with yarn or npm

yarn add react-gun

Initialize GunProvider to make your Gun() object available to any component...

App.js

import React, { Component } from 'react';
import Gun from 'gun';
import { GunProvider } from 'react-gun';

const App = props => {
  // Initialize all your app stuff
  let gun = Gun();
  return (
    <GunProvider gun={gun}>
      <ComponentThatUsesGun />
    </GunProvider>
  );
};
export default App;

Then call your gun instance by wrapping your component with {withGun}like so

Component.js

import React, { Component } from 'react';
import { withGun } from 'react-gun';

class ComponentThatUsesGun extends Component {
  state = {
    foo: null,
  };
  componentDidMount() {
    // Get objects from Gun() instance and use it to update state or do whatever else you'd like with it
    this.props.gun.get('foo').on(bar => {
      this.setState({
        foo: bar,
      });
    });
  }
  render() {
    if (!this.state.foo) {
      return <div>Loading...</div>;
    }
    return <div>{this.state.foo}</div>;
  }
}

export default withGun(ComponentThatUsesGun);

About

Simple Higher-Order Component for GunDB in React

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published