Show all users in Meteor React Client

Question

I am having problems so that all registered users are displayed on the client side. std:accounts-ui package is included in .meteor/packages . autopublish package removed.

Data for all users is published to Users.js as allUsers , and the client subscribes to publish allUsers from createContainer provided by react-meteor-data .

However, the page displays only the data of the user who is currently registered. Running Meteor.users().find().fetch() in a browser. The JS console shows only the current user and shows nothing if the user is not logged in.

Running console.log(Meteor.users.find().fetch() on the server side displays all users correctly.

Why is this happening in the browser?

/imports/api/Users.js

 import { Meteor } from 'meteor/meteor'; if (Meteor.isServer) { Meteor.publish('allUsers', function() { return Meteor.users.find({}); }) } 

/imports/ui/App.jsx

 import React, { Component, PropTypes } from 'react'; import { createContainer } from 'meteor/react-meteor-data'; import { Accounts } from 'meteor/std:accounts-ui'; import { Table } from 'react-bootstrap'; import User from './User'; export class App extends Component { renderUsers() { return this.props.users.map((user) => ( <User key={user._id} user={user} /> )); } render() { return ( <div> <h1>Users</h1> <Table> <tbody> <tr> <td>ID</td> <td>Email</td> <td>createdAt</td> </tr> { this.renderUsers() } </tbody> </Table> </div> ) } } App.propTypes = { users: PropTypes.array.isRequired } export default createContainer(() => { Meteor.subscribe('allUsers'); return { users: Meteor.users.find().fetch() } }, App); 

/imports/ui/User.jsx

 import React, { Component } from 'react'; export default class Users extends Component { render() { return ( <tr> <td>{ this.props.user._id}</td> <td>{ _.get(this.props, 'user.emails[0].address', 'UNKNOWN') }</td> <td>{ this.props.user.createdAt }</td> </tr> ) } } 

Answer 1

I had the same problem when I used angular 2 and a meteorite. I also tried to access data using Meteor.users.find({});

but this is the wrong way to use. To do this, you must first create a new collection like this

 export const Users = MongoObservable.fromExisting(Meteor.users);<-- most important line 

then in

 Meteor.publish("userData", function() { if (Roles.userIsInRole(this.userId, 'admin')) { return Meteor.users.find(); } else { const selector = { '_id': this.userId }; return Meteor.users.find(selector); } }); 

and use in your file by subscribing to it.

 MeteorObservable.subscribe('userData').subscribe(() => { this.userlist=Users.find({}); }); 

I did this in angular 2.you plz use reaction syntax for the last part of the subscription.