Fred J. Fred J. - 1 month ago 5x
React JSX Question

undefined collection name Meteor with React

This Meteor React client code produces browser console error:

ReferenceError: CarsCol is not defined

Any idea why? Thanks


import React from 'react';
import ReactDOM from 'react-dom';
import { composeWithTracker } from 'react-komposer';
import { ListItems } from '../containers/myList.jsx';

const composer = (props, onData) => {
const sub = Meteor.subscribe('carsCol');
if (sub.ready()) {
const cars = CarsCol.find().fetch(); //<------- error line
onData(null, {cars});

const Container = composeWithTracker(composer) (ListItems);
ReactDOM.render(<Container />, document.getElementById('react-root'));


const CarsCol = new Mongo.Collection('carsCol');
Meteor.publish('carsCol', function(){
return CarsCol.find();

enter image description here


You've defined the collection on the server only, you want to define the collection in both places.

What I would do is define your collection in a separate file and import that.


const CarsCol = new Mongo.Collection('carsCol');

Then in cars.jsx

import CarsCol from '../api/collections/CarsCol'