I'm trying to combine react-native and meteor using the react-native-meteor package. Meteor successfully publishes a 'dos' collection, which I have been able to subscribe to on the web client. However, after following the documentation of the react-native-meteor package (using createContainer) I am unable to subscribe; the handle is 'never ready'. When using the autopublish package from Meteor the data does load.
Versions
Meteor 1.3.4.1
react-native: 0.28.0
react-native-meteor: 1.0.0-rc14
index.ios.js
// @flow
'use strict'
import React, { Component } from 'react'
import {
AppRegistry,
StyleSheet,
View,
NavigatorIOS,
StatusBar,
Text,
} from 'react-native'
import Meteor, {
createContainer,
MeteorListView,
} from 'react-native-meteor'
Meteor.connect('ws://localhost:3000/websocket')
import GeoLocation from './app/GeoLocation'
import ConnectionInfoSubscription from './app/NetInfo'
import GridLayout from './app/GridLayout'
class DoCHANGE_0 extends Component {
renderRow(Do){
return(
<Text>{Do.joke}</Text>
)
}
render() {
const { doList, } = this.props
return (
<View style={styles.container}>
<StatusBar
barStyle="light-content"
/>
<NavigatorIOS
style = {styles.container}
barTintColor='#556270'
titleTextColor='#fff'
tintColor='#fff'
initialRoute={{
title: 'DoCHANGE',
component: GridLayout
}}/>
{!doList && <Text>Not ready with subscription</Text>}
<MeteorListView
collection="dos"
renderRow={this.renderRow}
enableEmptySections={true}
/>
</View>
)
}
}
const styles = StyleSheet.create({
container: {
flex:1,
}
});
export default createContainer(params=>{
const handle = Meteor.subscribe('dos')
return {
doList: handle.ready(),
};
}, DoCHANGE_0)
AppRegistry.registerComponent('DoCHANGE_0', () => DoCHANGE_0);
I have found similar examples but they often don't utilise the react-native-meteor package but use the ddpclient package instead. Am I missing something obvious here? Any insights is much appreciated!
Edit:
(Meteor) /server/publish.js
Meteor.publish("dos", function() {
//console.log(Dos.find().fetch())
return Dos.find();
})
(Meteor) /both/collections.js
Dos = new Mongo.Collection('dos');
Screenshot when using autopublish from Meteor. doList handle is still not ready. But the MeteorList gets populated correctly.
I upgraded to newer versions of react-native, meteor, and react-native-meteor but that didn't solve the issue. However, when renaming the renderRow function to renderItem it started working.
You only included client side code in your question, but it sounds like you are missing the Meteor.publish() call on the server, if it works using autopublish but not without it!