score:11

Accepted answer

you need to explicitly pass the props from parent to child. changing the render function of commentbox will fix the problem:

var commentbox = react.createclass({
  render: function() {
    return (
      <div classname="commentbox">
        <h1>comments</h1>
        <commentlist />
        //the next line is where you can pass the url to the commentform
        <commentform url={this.props.url}/>
      </div>
    );
  }
});

working jsfiddle adapted from your example: http://jsfiddle.net/kb3gn/10352/

the docs say "for parent-child communication, simply pass props." see http://facebook.github.io/react/tips/communicate-between-components.html

as an alternative to explicitly passing props, react's undocumented context feature is closer to what you're looking for: https://www.tildedave.com/2014/11/15/introduction-to-contexts-in-react-js.html and is on the roadmap for 1.0 https://facebook.github.io/react/blog/2014/03/28/the-road-to-1.0.html#context.

that said, passing props is the normal pattern.


Related Query

More Query from same tag