javascript - React + Backbone, Target container is not a DOM element -
note: react error being thrown.
so trying experiment render post component backbone router based on page. know not typically things way, things can messy , such. again it's experiment.
so have following route in backbone (note react call):
aisiswriter.routers.posts = backbone.router.extend({ writer_posts: null, posts: null, mountnode: $('#blog-manage'), routes : { '': 'index' }, initialize: function() { this.writer_posts = new aisiswriter.collections.posts(); }, index: function() { var options = { reset: true }; this.writer_posts.fetch(options).then(this.postsrecieved, this.servererror); }, // deal posts received postsrecieved: function(collection, response, options) { this.posts = collection; // walk through posts. $.each(this.posts, function(key, value){ // value array of objects. $.each(value, function(index, post_object){ react.rendercomponent(new post({post: post_object}), this.mountnode); }); }); }, // deal server errors servererror: function() { console.log('there error trying fetch posts.'); } });
the idea should spit out post title on page, 1 right after other (i have feeling once).
but issue console saying:
uncaught error: invariant violation: _registercomponent(...): target container not dom element.
is because of how trying render component?
react.rendercomponent
renders component real dom element. exception being thrown because aren't passing dom element required second argument.
reactcomponent rendercomponent( reactcomponent component, domelement container, [function callback] )
render react component dom in supplied container , return reference component.
if want html react, can use react.rendercomponenttostaticmarkup
instead.
Comments
Post a Comment