New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
problem with jsx spread operator and props passed to children components #51
Comments
sotaan
changed the title
problem with jsx spred operator and props passed to children components
problem with jsx spread operator and props passed to children components
Jan 31, 2017
I got the same problem. |
I'm also experiencing this problem. In this view, the spread operator works as expected: import Posts from 'components/Posts'
import Profile from 'components/Profile'
import posts from '../../posts'
export default {
name: 'Home',
render (h) {
// Set props to be passed here
const data = {
props: {
posts: posts,
msg: 'hola'
}
}
return (
<div class='page'>
<Profile />
<Posts {...data} />
</div>
)
}
} Then, in the child component import Post from '../Post'
export default {
name: 'Posts',
props: {
posts: Array,
msg: String
},
render (h) {
const data = {
posts: this.posts
}
return (
<div>
{
data.posts.map((post, index) =>
<Post key={index}
// {...post} doesn't work
author={post.author}
title={post.title}
tags={post.tags}
date={post.date}
/>
)
}
</div>
)
}
} Finally, the child component export default {
name: 'Post',
props: {
author: String,
date: String,
tags: Array,
title: String
},
render (h) {
const data = {
author: this.author,
date: this.date,
tags: this.tags,
title: this.title
}
return (
<div>
<h1>{data.title}</h1>
<h2>{data.author}</h2>
<h3>{data.date}</h3>
{data.tags.map((tag, i) => <h5 key={i}>{tag}</h5>)}
</div>
)
}
} |
If you experience the same problem check #86, will keep that ticket updated. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Here is my code:
None of the techniques used to inject props works 😢
The text was updated successfully, but these errors were encountered: