A deepstream React wrapper that exports Class supporting render prop and HOCs
npm install react-deepstream-rp-hoc javascript
import {withDeepstream} from 'react-deepstream-rp-hoc';
class AppBase extends React.Component {
render () {
if (this.props.connected) {
return
} else {
return Loading
}
}
}
let App = withDeepstream(AppBase)
`
Returns Base App Class wrapped with deepstream client. `this.props.connected` indicates client connection status. E.g.
`javascript
`List Component loads Deepstream List of given 'ListName'.
` javascript
import {withDeepstreamList} from 'react-deepstream-rp-hoc';
class ListBase extends React.Component {
render() {
const entries = this.props.entries;
const records = entries.map( (record) =>
);
return {records}
}
}
let List = withDeepstreamList(ListBase);
`
Returns Base List Class wrapped with deepstream list. E.g.
` javascript
`
Record Component loads Deepstream JSON document of given 'recordName'.
` javascript
import {withDeepstreamAnonRecord} from 'react-deepstream-rp-hoc';
class RecordBase extends React.Component {
render() {
return {JSON.stringify(this.props.data)}
}
}
let Record = withDeepstreamAnonRecord(RecordBase);
`
Returns Base Document Class wrapped with deepstream anonymous record. E.g.
` javascript
`$3
The same as above but using render props.` javascript
import {
Deepstream,
DeepstreamList,
DeepstreamAnonRecord
} from 'react-deepstream-rp-hoc';
import React from 'react';let config = {
"appUrl": "",
"authParams": {},
"listName": ""
}
class Record extends React.Component {
render() {
return render = { (record) =>
{JSON.stringify(record.data)}
}
/>
}
}class List extends React.Component {
render() {
return render = { (list) =>
{
list.entries.map( (record) =>
)}
}
/>
}
}class App extends React.Component {
render () {
return render = { (ds) =>
ds.connected
?
:
Loading ...
}
/>
}
}export default App;
``