I’m using react and react komposer. Im getting:
Exception from Tracker recompute function: debug.js:41 TypeError: TeckStack.map is not a function at ReadStepsListTop (ReadStepsListTop.jsx:8)
This is my component
import React from 'react';
export const ReadStepsListTop = ({TeckStack}) => (
<div>
{TeckStack.map(({_id,teckstack}) => (
<h4>{teckstack}</h4>
))}
</div>
)
and this is its container
import React from 'react';
import { composeWithTracker } from 'react-komposer';
import {ReadStepsListTop} from './ReadStepsListTop.jsx';
import { DocHead } from 'meteor/kadira:dochead';
import CircularProgress from 'material-ui/CircularProgress';
import darkBaseTheme from 'material-ui/styles/baseThemes/darkBaseTheme';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import getMuiTheme from 'material-ui/styles/getMuiTheme';
function composer(props, onData) {
const handle = Meteor.subscribe('singletechstack', props._id);
if(handle.ready()) {
const TeckStack = TechStack.findOne({_id: props._id});
onData(null, {TeckStack});
// Make our blog posts SEO friendly
// DocHead.setTitle(techstacksingle.teckstack);
// DocHead.addMeta({
// name: 'description', content: project.projectdescription
// });
}
};
const darkMuiTheme = getMuiTheme(darkBaseTheme);
const MyLoading = () => (<div style={{width:'90%', position:'relative'}}>
<MuiThemeProvider muiTheme={darkMuiTheme}>
<div style={{margin:'auto', right:0, left:0, width:300, position:'relative'}}>
<p style={{textAlign:'center'}}><CircularProgress size={1.5} /></p>
</div>
</MuiThemeProvider>
</div>);
export default MyLoading;
export default composeWithTracker(composer,MyLoading )(ReadStepsListTop);
Where could I have gone wrong