CODEWITHSUNDEEP
reactjsmeteorpublishsubscribe
slip0000
slip0000

Reputation: 17

Meteor Publish/Subscribe with users data

I'm banging my head against a brick wall with this. Cannot seem to find an example that works for me.

this is my server side

Meteor.publish("allUserData", function () {
    return Meteor.users.find({}, {fields: {'username': 1, 'profile': 1}});
},
{is_auto: true});

and this is my client

var allUserData = Meteor.subscribe("allUserData");
Tracker.autorun(function() {
    if (allUserData.ready()) {
        console.log('ready');
    }
});

I get the 'ready' logging but cannot see how to iterate through the returned data???

Upvotes: 0

Views: 319

Answers (2)

zim
zim

Reputation: 2386

for React, you can set props on the component with createContainer(). e.g.

import React, {Component} from 'react';
import {createContainer} from 'meteor/react-meteor-data';

class FooComponent extends Component {
    constructor(props) {
        super(props);
    }

    render() {
        if (this.props.loading) {
            return (
                <div>Loading</div>
            )
        }

        return (
{
                    this.props.users.map(function(user, index) {
                        return (
                            <div key={index.toString()}>
                                {user.username}
                            </div>
                        )
                    }, this)
                }
        )
    }
}

export default createContainer(() => {
    let handle = Meteor.subscribe('allUserData');

    let users = Meteor.users.find({});

    let loading = !handle.ready();

    return {
        users,
        loading
    }
}, FooComponent);

i haven't tested this, if it's not right i think it's at least kinda close. forgive me if i've gotten something wrong, my React skills are still pretty newish.

Upvotes: 1

zim
zim

Reputation: 2386

you don't say how you want it iterate through the data. the "standard" way is looping in Blaze with a helper that returns a cursor to the subscribed collection:

html:

{{#each user in users}}
    {{user.username}}
{{/each}}

js:

Template.foo.onCreated(function() {
    this.subscribe('allUserData');
});

Template.foo.helpers({
    users() {
        return Meteor.users.find({});
    }
});

Upvotes: 1

Related Questions