0

Meteor Apollo demo repoで遊んでいます。

React を使用して変数を子に渡すのに苦労しています。エラーが発生します

imports/ui/Container.jsx:10:6: 予期しないトークン (10:6)

以下のコードは、Container.jsx コンポーネントです。

import React from 'react';
import { Accounts } from 'meteor/std:accounts-ui';

class Container extends React.Component {
  render() {
    let userId = this.props.userId;
    let currentUser = this.props.currentUser;
    }
    return (
      <Accounts.ui.LoginForm />
      { userId ? (
        <div>
          <pre>{JSON.stringify(currentUser, null, 2)}</pre>
          <button onClick={() => currentUser.refetch()}>Refetch!</button>
        </div>
      ) : 'Please log in!' }
     );
   }
 }

Meteor Apollo データ システムを介して props が渡されます (上部のインポートは省略しています)。

const App = ({ userId, currentUser }) => {
  return (
    <div>
    <Sidebar />
    <Header />
    <Container userId={userId} currentUser={currentUser} />
    </div>
  )
}

// This container brings in Apollo GraphQL data
const AppWithData = connect({
  mapQueriesToProps({ ownProps }) {
    if (ownProps.userId) {
      return {
        currentUser: {
          query: `
            query getUserData ($id: String!) {
              user(id: $id) {
                emails {
                  address
                  verified
                }
                randomString
              }
            }
          `,
          variables: {
            id: ownProps.userId,
          },
        },
      };
    }
  },
})(App);

// This container brings in Tracker-enabled Meteor data
const AppWithUserId = createContainer(() => {
  return {
    userId: Meteor.userId(),
  };
}, AppWithData);

export default AppWithUserId;

いくつかの指針をいただければ幸いです。

4

1 に答える 1

1

エラーは、ステートメントのrender前に誤って関数を終了したことだと思います。return

render() { // <- here it starts
    let userId = this.props.userId;
    let currentUser = this.props.currentUser;
    } // <- here it ends

もう 1 つのエラーは、return ステートメントが単一の DOM 要素を返さず、そのうちの 2 つ ( anAccounts.ui.LoginFormと a ) を返すことdivです。return 関数は 1 つの要素のみを返す必要があります。全体を 1 つの に入れるだけ<div>です。

于 2016-05-04T10:51:34.057 に答える