Get object properties not working on Android

[grunch]

Hi everyone!

I've been playing with react and meteor and I have my first blocker, I've been researching and asking but without success, @spencercarli told me that it would be a good idea to open an issue, so here we go :)

I connect to my local server on meteor without any problem, in fact I got data, the problem is when I try to show this data on my view.

This is my app.js file

import React, { Component } from 'react';
import {
  Text,
  View,
  ScrollView
} from 'react-native';
  import Meteor, { createContainer } from 'react-native-meteor';
import FacebookTabBar from './fbtabbar';
import ScrollableTabView from 'react-native-scrollable-tab-view';
import MenuView from './menuView'

const SERVER_URL = 'ws://192.168.56.1:3000/websocket';

class App extends Component {
  componentWillMount() {
    Meteor.connect(SERVER_URL);
  }

  render() {
    const { resto } = this.props;
    console.log(resto); // this show in console the whole object fine
    console.log(resto.name); // I got "Cannot read property 'name' of undefined"
    return (
      <ScrollableTabView
            style={{marginTop: 20, }}
            initialPage={1}
            renderTabBar={() => <FacebookTabBar />}
            >
            <ScrollView tabLabel="cutlery">
              <View>
                <Text> {this.props.cuenta}</Text>
              </View>
            </ScrollView>
            <ScrollView tabLabel="search">
              <View>
                <Text style={{color:'#000'}}></Text>
              </View>
            </ScrollView>
          </ScrollableTabView>
    );
  }
}

export default createContainer(() => {
  Meteor.subscribe('resto');
  return {
    resto: Meteor.collection('restaurantes').findOne() || {},
    count: Meteor.collection('restaurantes').find().length,
  };
}, App);

I can get and show in the view the 'count' prop and also I get the object 'resto' from the this.props.resto, when I print the object with a console.log(resto) I get in console the object correctly, but I can't get the property name or any other property.

I put here the js with the object that is mongo in case it can be helpful

var r = {
    "name" : "La Conga",
    "menu" : [ 
        {
            "name" : "Promociones",
            "entry" : [ 
                {
                    "name" : "Promo 1 - Pollo Mochica",
                    "description" : "Salsas: vinagreta, aceituna, mayonesa casera y picante. Comen 4 personas.",
                    "costo" : 280.0
                }, 
                {
                    "name" : "Promo 2 - Salchipapa para dos + agua saborizada Aquarius 500 ml",
                    "description" : "Salchichas y papas fritas.",
                    "costo" : 150.0
                }
            ]
        }
    ]
};

db.restaurantes.insert(r);

I am using react-native: 0.30.0 Meteor 1.4.0.1 react-native-meteor 1.0.0-rc14

Running for android with genymotion

[Mokto]

I think this is because resto is not known while your resto subscription is not ready.

You should add if(!resto) return null; into your render method.