I am trying to find out whether a method exist to do this or if there is a workaround; I will explain what I am trying to accomplish below, but to summarize the question: is there a way to update props that were passed down from rails controller without having to refresh the page?
Basically, when I started react-on-rails, its default controller looks like this:
def index
@hello_world_props = { name: "Stranger" }
end
It passes down @hello_world_props to the React component.
I modified mine to look like:
def index
@scheduler_props = { currentUserId: current_user.id.to_s, schedules: Schedule.where(user_id: current_user.id.to_s) }
end
Essentially it passes down current user’s id and an array of schedules. I created the corresponding states:
export default class App extends React.Component {
static propTypes = {
currentUserId: PropTypes.string.isRequired,
schedules: PropTypes.array.isRequired
};
constructor(props, _railsContext) {
super(props);
this.state = { currentUserId: this.props.currentUserId, schedules: this.props.schedules };
}
...
In my DB, I have one schedule saved already. Naturally, when I console.log(this.props.schedule), it displays one schedule. Still on the same page, I then POST another schedule.
However, when I console.log(this.props.schedules), it still shows one schedule, not two. I have to refresh the page before my this.props.schedules updates and displays two schedules.
Is there a way, using react-on-rails, to automatically update the incoming props from your controller without having to refresh the page, i.e., is there a way for me to update schedules: Schedule.where(user_id: current_user.id.to_s) whenever rails DB is updated?
Thanks, guys!!