CODEWITHSUNDEEP
ruby-on-railsreactjs
Victor Oliveira
Victor Oliveira

Reputation: 1129

react component not rendering on my view

I installed react-rails on my project, added the 

gem 'react-rails'

then I used 

rails g react:install

I have my index html index.html.erb with the react_component helper calling my componnet 

<%= react_component("Post", {title: "Hello World"}) %>

And I have this post component at app/assets/javascript/components/post.jsx

class Post extends React.Component {
  render() {
    return <h1>{this.props.title}</h1>    
  }
}

But my component is not rendering on the screen

why?

Upvotes: 14

Views: 8524

Answers (4)

Jin Lim
Jin Lim

Reputation: 2140

Running this line again.

rails webpacker:install:react

This solved my issue.

Upvotes: 0

Constantine
Constantine

Reputation: 479

Make sure you have added the <%= javascript_pack_tag 'application' %> directive into your layout file.

Also in my case I forgot to run rails generate react:install as specified here: https://github.com/reactjs/react-rails#3-now-run-the-installers which sets up the ReactRailsUJS setup in app/javascript/packs/application.js

Upvotes: 11

Victor Oliveira
Victor Oliveira

Reputation: 1129

Just need to add prerender: true, in the component, and it works.

<%= react_component("Post", {title: "Hello World"}, {prerender: true}) %>

Upvotes: 9

dpalazzari
dpalazzari

Reputation: 102

I believe the return portion in your render function requires parenthesis:

class Post extends React.Component {
  render() {
    return (<h1>{this.props.title}</h1>)
   }
}

Upvotes: -3

Related Questions