CommanderB CommanderB - 1 year ago 69
CoffeeScript Question

Cannot read a property in React-0.13.3 CJSX code

I'm working on a react.js app which will be displaying tweets. unfortunately there's an error that says, "Cannot read property 'profileImageUrl' of Undefined." which is this line:

<img src={@props.details.tweet.user.profileImageUrl} />


I'm using React 0.13.3 to do this. Here's a piece of my Coffeescript CJSX code that includes the property in question

Tweet = React.createClass
propTypes:
details: React.PropTypes.object.isRequired

render: ->
<article className="tweet-container">
<div className="tweet-profile-picture">
<img src={@props.details.tweet.user.profileImageUrl} />
</div>
<div className="tweet-body">
<header className="tweet-header">
<div className="tweet-metadata">
<a href="//twitter.com/# {@props.details.tweet.user.screenName}">
<span className="name">{@props.details.tweet.user.name}</span>
<span className="screenName">{@props.details.tweet.user.screenName}</span>
</a>
</div>
</header>
<p>{@props.details.tweet.text}</p>
</div>
<div className="timestamp">
<a href="//twitter.com/#{@props.details.tweet.user.screenName}/status/#{@props.details.tweet.idStr}">
<time datetime={@props.details.tweet.createdAt}><moment(@props.details.createdAtTimestamp).fromNow()}</time>
</a>
</div>
</article>


Why is it saying that the profile image url is undefined? Where would be the best place to start to fix this? Thank you in advanced for your help.

Answer Source

I ended up fixing the service. It turns out @props.details.tweet.user was null in the api. The code is working properly now.