Question

我正在编写我的第一个流星/反应应用程序。我做了一个自定义路由器，但后来决定最好使用react-router软件包。

我有一个非常简单的模板，但是由于某种原因，它无法呈现。运行应用程序时，我只会看到一个空白页。

这是我组件的完整代码：

import React, { Component } from 'react';

export default class Connect extends Component {
  render() {
    return (
      <h1>Here is the connect page!</h1>
    );
  }
}

这是我的router.js：

import React from 'react';
import { Router, Route, Switch } from 'react-router';
import createBrowserHistory from 'history/createBrowserHistory'

import {Home} from '../home/home.js'
import {Login} from '../login/login.js';
import {Connect} from '../connect/connect.js';

const browserHistory = createBrowserHistory();

export const renderRoutes = () => (
  <Router history={browserHistory}>
    <Switch>
      <Route exact path="/" component={Home}/>
      <Route exact path="/login" component={Login}/>
      <Route exact path="/connect" component={Profile}/>
      <Route component={NotFoundPage}/>
    </Switch>
  </Router>
);

这是main.js：

import React, { Component } from 'react';
import { Template } from 'meteor/templating';
import { ReactiveVar } from 'meteor/reactive-var';
import { renderRoutes} from './lib/router.js';

export default class App extends Component {

  render() {
    return (
      <head>
        <title>myapp</title>
      </head>
    );
  }
}

运行应用程序时，我没有看到任何错误消息。任何帮助表示赞赏！

编辑：

我尝试将对renderRoutes的调用添加到main.js，但这似乎无济于事。这是我的新main.js：


import React, { Component } from 'react';
import { Template } from 'meteor/templating';
import { ReactiveVar } from 'meteor/reactive-var';
import { renderRoutes} from './lib/router.js';


Meteor.startup(() => {
  render(renderRoutes(), document.getElementById('app'));
});

// App component - represents the whole app
export default class App extends Component {

  render() {
    return (
      <head>
        <title>my_app</title>
      </head>
    );
  }
}

React组件无法在Meteor应用中呈现

0 个答案: