Question

我目前正在使用themeteorchef/base样板项目。当我从Meteor / Blaze转向Meteor / React世界时，它真的很有用。

直接通过容器将订阅数据传递给组件。但是，尝试创建一个基本的个人资料页面已经非常困难，我觉得我错过了一些简单的东西。到目前为止，我已经设法将用户对象作为json字符串传递（这不是理想的）。

我的问题是 - 将登录用户的信息传递给反应组件的最佳方法是什么？

在我的容器中，我有......

import { Meteor } from 'meteor/meteor';
import { composeWithTracker } from 'react-komposer';
import ViewProfile from '../pages/ViewProfile.js';
import Loading from '../components/Loading.js';

const composer = ({ params }, onData) => {
  const currentUser = JSON.stringify( Meteor.user() );
  onData(null, { currentUser });
};

export default composeWithTracker(composer, Loading)(ViewProfile);

我的组件是一个简单的显示器......

import React from 'react';
import NotFound from './NotFound';

const ViewProfile = ( { currentUser } ) => { 
  return currentUser ? (
    <p>{ currentUser }</p>
  ) : <NotFound />;
};

ViewProfile.propTypes = {
  currentUser: React.PropTypes.string
};

export default ViewProfile;

Answer 1

终于搞定了！

通过容器传递Meteor.user（被动数据）仍然是正确的方法，它正在进入组件，但是，在我的组件中我只需要引用特定的对象值（字符串或数组）。

所以在我的容器中：

gene_id    gene_name    trans_id
scaffold_200001.1
scaffold_200001.1    scaffold_200001.1
scaffold_200002.1    scaffold_200002.1

然后在我的组件中：

import { composeWithTracker } from 'react-komposer';
import ViewProfile from '../pages/ViewProfile.js';
import Loading from '../components/Loading.js';

const composer = (params, onData) => {
  const user = Meteor.user();

  if (user) {
      const currentUser = {
          fname: user.profile.name.first,
          lname: user.profile.name.last,
          email: user.emails[0].address
      }

      onData(null, { currentUser });
  }

export default composeWithTracker(composer, Loading)(ViewProfile);

Answer 2

实际上，您可以在任何地方访问“Meteor.user（）”，因此您无需从Composer或Parent-Component传递它。因此，在您的简单组件中，您可以使用：

import React from 'react';
import NotFound from './NotFound';

const ViewProfile = () => { 
  return (Meteor.user()) ? (
    <p>{JSON.stringify(Meteor.user())}</p>
  ) : <NotFound />;
};

export default ViewProfile;

将Meteor.user（）传递给组件？

2 个答案: