CODEWITHSUNDEEP
javascriptmeteorreact-nativeddp
martwetzels
martwetzels

Reputation: 437

React-native-meteor package subscription handle not ready

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.

Screenshot iOS autopublish on

Upvotes: 0

Views: 681

Answers (2)

martwetzels
martwetzels

Reputation: 437

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.

renderRow={this.renderRow}

renderRow={this.renderItem}

Upvotes: 0

Jesper We
Jesper We

Reputation: 6087

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!

Upvotes: 0

Related Questions