Meteor + React: using createContainer, ReferenceError: [classname] is not defined?


#1

Hi,

I’m trying to write a new website in Meteor + react. I’m following a tutorial which says that I should use createContainer on the main app component, but altering it to match the latest version of the bootstrap meteor+react code that was referenced in an earlier tutorial.

This has worked fine so far, until I tried to tie my data object to a mongo database, at which point I got “ReferenceError: LotsView is not defined” from the router.

Could you please help me?

Thank you!

Code below:

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

import { Lots } from '../../api/api.js';
import LotView from './LotView.jsx';

class LotsView extends Component {

  renderLots() {
    return this.props.lots.map((lot) => (
      
    ));
  }

  render() {
    return (
      

View Lots

    {this.renderLots()}
); } } LotsView.propTypes = { lots: PropTypes.array.isRequired, } export default createContainer( () => { return { lots: Lots.find({}).fetch(), } }, LotsView );

#3

you need to post more code about your classNames


#4

classNames came with (and was defined in) the bootstrap meteor+react tutorial. I can’t see where it is defined in the code, but copying the notation I was able to get the program to display static content in a list.

I have a LotView class which stores an _id and text, and Lots which is a Mongo wrapper, sitting in api.js

This was working before I changed the name of LotsView from Lots to LotsView, in order to define the Lots Mongo proxy class.

The problem now is that after using export default createcontainer(()->{}, LotsView) I’m getting the console error “LotsView is not defined”

Can you see the error in my createContainer call, or an error in the class definition that would kill the createContainer call?

What else do you need me to post?


#5

How are you referencing your created container in your router config - can you share your router config?


#6

From routes.js:

import Home from '../ui/pages/Home.jsx';
import NotFound from '../ui/pages/NotFound.jsx';
import Lots from '../ui/components/LotsView.jsx';

const routes = [
  {
    path: '/',
    component: Home
  },
  {
    path: '/lots',
    component: LotsView
  },
  {
    path: '*',
    component: NotFound
  }
];

export default routes;

#7

Oh.

I’m retarded.

Thank you hwillson!