stone rock
stone rock

Reputation: 1953

React 'component' argument missing error?

I have created Header component. I am using this react Header component with meteor-blaze but I am getting error in console saying react argument component missing. I am referring this docs -> https://guide.meteor.com/react.html#blaze-in-react

league_header.html:

<template name="LeagueHeader">
{{#if isCordova}}
  {{> HeaderMobile }}
{{else}}
    <div>
        {{> React component=Header }}
    </div>
{{/if}}
</template>

headerhelper.js:

import { Template } from 'meteor/templating';

import './league_header.html';
import Header from '../../../imports/Header.jsx';

Template.LeagueHeader.helpers({
  HeaderHelper() {
    return Header;
  }
})

Header.jsx:

import React, { Component } from 'react';

class Header extends Component {

    render() {
        console.log('Hello Component');
        return (
            <div>
                <h2>Hello World</h2>
            </div>
        );
    }
}

export default Header;

Error:

Error: In template "LeagueHeader", call to `{{> React ... }}` missing `component` argument.
    at Blaze.View.<anonymous> (react-template-helper.js:23)
    at blaze.js?hash=f33d3dfed63a491d24e3aa07ad66c24b5fe8c761:1934
    at Function.Template._withTemplateInstanceFunc (blaze.js?hash=f33d3dfed63a491d24e3aa07ad66c24b5fe8c761:3744)
    at blaze.js?hash=f33d3dfed63a491d24e3aa07ad66c24b5fe8c761:1932
    at Object.Blaze._withCurrentView (blaze.js?hash=f33d3dfed63a491d24e3aa07ad66c24b5fe8c761:2271)
    at viewAutorun (blaze.js?hash=f33d3dfed63a491d24e3aa07ad66c24b5fe8c761:1931)
    at Tracker.Computation._compute (tracker.js?hash=997515fa2d5b0530ba07741da556c4b36963ef3b:339)
    at new Tracker.Computation (tracker.js?hash=997515fa2d5b0530ba07741da556c4b36963ef3b:229)
    at Object.Tracker.autorun (tracker.js?hash=997515fa2d5b0530ba07741da556c4b36963ef3b:613)
    at Blaze.View.autorun (blaze.js?hash=f33d3dfed63a491d24e3aa07ad66c24b5fe8c761:1944)

Screenshot: enter image description here

Upvotes: 1

Views: 4818

Answers (1)

Fawzi
Fawzi

Reputation: 369

You are using the wrong helper name Try replacing the component call with this.

{{> React component=HeaderHelper}}

Upvotes: 2

Related Questions