Mixing
render multiple variable in Json from rails to react
I want to display a list of meals from my rails backend to my react frontend. In addition, I'd like to add a specific date.
Here is what I have so far:
meals_controller.rb
def index
@meals = Meal.where(week_day: Date.today.cwday).order('random()')
@date = DateTime.now
render json: @meals.to_json(include: :restaurant)
end
MealsPage.js:
componentDidMount() {
axios.get('/meals.json')
.then(response => {
this.setState({
meals: response.data
});
})
.catch(error => console.log(error))
}
I'd like to add @datein the render method so that I could do something like:
this.setState({
meals: response.data.meals,
date: response.data.date
});
But everything I have tried so far has failed. I've tried things like:
render json: [@meals.to_json(include: :restaurant), @date]
or
render json: {meals: @meals.to_json(include: :restaurant), date: @date}
But both of these solutions send my @meals as one big string like "[{}, {}, {}]" instead of rendering it as an array of objects.
Any idea on I can make this work ?
ruby-on-rails reactjs
asked Nov 19 '18 at 14:27
Jules Corb
417414
add a comment |
I want to display a list of meals from my rails backend to my react frontend. In addition, I'd like to add a specific date.
Here is what I have so far:
meals_controller.rb
def index
@meals = Meal.where(week_day: Date.today.cwday).order('random()')
@date = DateTime.now
render json: @meals.to_json(include: :restaurant)
end
MealsPage.js:
componentDidMount() {
axios.get('/meals.json')
.then(response => {
this.setState({
meals: response.data
});
})
.catch(error => console.log(error))
}
I'd like to add @datein the render method so that I could do something like:
this.setState({
meals: response.data.meals,
date: response.data.date
});
But everything I have tried so far has failed. I've tried things like:
render json: [@meals.to_json(include: :restaurant), @date]
or
render json: {meals: @meals.to_json(include: :restaurant), date: @date}
But both of these solutions send my @meals as one big string like "[{}, {}, {}]" instead of rendering it as an array of objects.
Any idea on I can make this work ?
ruby-on-rails reactjs
asked Nov 19 '18 at 14:27
Jules Corb
417414
how exactly it is not working? and did it work before you decided to add more nesting in there?
– potashin
Nov 19 '18 at 14:33
Hi @potashin, I does work when I only have mymealsto render. The data are fetched from the backend correctly but it is on the react that the error is raised:reponse.data.mealsdoes not seem to work.
– Jules Corb
Nov 19 '18 at 14:36
@potashin I just realised that my meals are rendered as one big string instead of an array of hash. I update my post to make it clearer.
– Jules Corb
Nov 19 '18 at 14:42
add a comment |
I want to display a list of meals from my rails backend to my react frontend. In addition, I'd like to add a specific date.
Here is what I have so far:
meals_controller.rb
def index
@meals = Meal.where(week_day: Date.today.cwday).order('random()')
@date = DateTime.now
render json: @meals.to_json(include: :restaurant)
end
MealsPage.js:
componentDidMount() {
axios.get('/meals.json')
.then(response => {
this.setState({
meals: response.data
});
})
.catch(error => console.log(error))
}
I'd like to add @datein the render method so that I could do something like:
this.setState({
meals: response.data.meals,
date: response.data.date
});
But everything I have tried so far has failed. I've tried things like:
render json: [@meals.to_json(include: :restaurant), @date]
or
render json: {meals: @meals.to_json(include: :restaurant), date: @date}
But both of these solutions send my @meals as one big string like "[{}, {}, {}]" instead of rendering it as an array of objects.
Any idea on I can make this work ?
ruby-on-rails reactjs
asked Nov 19 '18 at 14:27
Jules Corb
417414
I want to display a list of meals from my rails backend to my react frontend. In addition, I'd like to add a specific date.
Here is what I have so far:
meals_controller.rb
def index
@meals = Meal.where(week_day: Date.today.cwday).order('random()')
@date = DateTime.now
render json: @meals.to_json(include: :restaurant)
end
MealsPage.js:
componentDidMount() {
axios.get('/meals.json')
.then(response => {
this.setState({
meals: response.data
});
})
.catch(error => console.log(error))
}
I'd like to add @datein the render method so that I could do something like:
this.setState({
meals: response.data.meals,
date: response.data.date
});
But everything I have tried so far has failed. I've tried things like:
render json: [@meals.to_json(include: :restaurant), @date]
or
render json: {meals: @meals.to_json(include: :restaurant), date: @date}
But both of these solutions send my @meals as one big string like "[{}, {}, {}]" instead of rendering it as an array of objects.
Any idea on I can make this work ?
ruby-on-rails reactjs
ruby-on-rails reactjs
asked Nov 19 '18 at 14:27
Jules Corb
417414
asked Nov 19 '18 at 14:27
Jules Corb
417414
edited Nov 19 '18 at 14:43
asked Nov 19 '18 at 14:27
Jules Corb
417414
asked Nov 19 '18 at 14:27
Jules Corb
417414
asked Nov 19 '18 at 14:27
Jules Corb
417414
417414
how exactly it is not working? and did it work before you decided to add more nesting in there?
– potashin
Nov 19 '18 at 14:33
Hi @potashin, I does work when I only have mymealsto render. The data are fetched from the backend correctly but it is on the react that the error is raised:reponse.data.mealsdoes not seem to work.
– Jules Corb
Nov 19 '18 at 14:36
@potashin I just realised that my meals are rendered as one big string instead of an array of hash. I update my post to make it clearer.
– Jules Corb
Nov 19 '18 at 14:42
add a comment |
how exactly it is not working? and did it work before you decided to add more nesting in there?
– potashin
Nov 19 '18 at 14:33
Hi @potashin, I does work when I only have mymealsto render. The data are fetched from the backend correctly but it is on the react that the error is raised:reponse.data.mealsdoes not seem to work.
– Jules Corb
Nov 19 '18 at 14:36
@potashin I just realised that my meals are rendered as one big string instead of an array of hash. I update my post to make it clearer.
– Jules Corb
Nov 19 '18 at 14:42
how exactly it is not working? and did it work before you decided to add more nesting in there?
– potashin
Nov 19 '18 at 14:33
how exactly it is not working? and did it work before you decided to add more nesting in there?
– potashin
Nov 19 '18 at 14:33
Hi @potashin, I does work when I only have my
meals to render. The data are fetched from the backend correctly but it is on the react that the error is raised: reponse.data.meals does not seem to work.– Jules Corb
Nov 19 '18 at 14:36
Hi @potashin, I does work when I only have my
meals to render. The data are fetched from the backend correctly but it is on the react that the error is raised: reponse.data.meals does not seem to work.– Jules Corb
Nov 19 '18 at 14:36
@potashin I just realised that my meals are rendered as one big string instead of an array of hash. I update my post to make it clearer.
– Jules Corb
Nov 19 '18 at 14:42
@potashin I just realised that my meals are rendered as one big string instead of an array of hash. I update my post to make it clearer.
– Jules Corb
Nov 19 '18 at 14:42
add a comment |
1 Answer
1
active
oldest
votes
You should use as_json instead if to_json here:
render json: { meals: @meals.as_json(include: :restaurant), date: @date }
answered Nov 19 '18 at 14:45
potashin
38.2k96489
1
thank you very much for your help @potashin ! It did the trick perfectly.
– Jules Corb
Nov 19 '18 at 14:47
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53376739%2frender-multiple-variable-in-json-from-rails-to-react%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
You should use as_json instead if to_json here:
render json: { meals: @meals.as_json(include: :restaurant), date: @date }
answered Nov 19 '18 at 14:45
potashin
38.2k96489
1
thank you very much for your help @potashin ! It did the trick perfectly.
– Jules Corb
Nov 19 '18 at 14:47
add a comment |
You should use as_json instead if to_json here:
render json: { meals: @meals.as_json(include: :restaurant), date: @date }
answered Nov 19 '18 at 14:45
potashin
38.2k96489
1
thank you very much for your help @potashin ! It did the trick perfectly.
– Jules Corb
Nov 19 '18 at 14:47
add a comment |
You should use as_json instead if to_json here:
render json: { meals: @meals.as_json(include: :restaurant), date: @date }
answered Nov 19 '18 at 14:45
potashin
38.2k96489
You should use as_json instead if to_json here:
render json: { meals: @meals.as_json(include: :restaurant), date: @date }
answered Nov 19 '18 at 14:45
potashin
38.2k96489
answered Nov 19 '18 at 14:45
potashin
38.2k96489
answered Nov 19 '18 at 14:45
potashin
38.2k96489
answered Nov 19 '18 at 14:45
potashin
38.2k96489
38.2k96489
1
thank you very much for your help @potashin ! It did the trick perfectly.
– Jules Corb
Nov 19 '18 at 14:47
add a comment |
1
thank you very much for your help @potashin ! It did the trick perfectly.
– Jules Corb
Nov 19 '18 at 14:47
1
1
thank you very much for your help @potashin ! It did the trick perfectly.
– Jules Corb
Nov 19 '18 at 14:47
thank you very much for your help @potashin ! It did the trick perfectly.
– Jules Corb
Nov 19 '18 at 14:47
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53376739%2frender-multiple-variable-in-json-from-rails-to-react%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
how exactly it is not working? and did it work before you decided to add more nesting in there?
– potashin
Nov 19 '18 at 14:33
Hi @potashin, I does work when I only have my
mealsto render. The data are fetched from the backend correctly but it is on the react that the error is raised:reponse.data.mealsdoes not seem to work.– Jules Corb
Nov 19 '18 at 14:36
@potashin I just realised that my meals are rendered as one big string instead of an array of hash. I update my post to make it clearer.
– Jules Corb
Nov 19 '18 at 14:42