react-jsx

I'm trying to build some menu using React and need some Django reverse urls in this menu. Is it possible to get django url tag inside JSX? How can this be used? render: function() { return <div> <ul className={"myClassName"}> <li><a href="{% url 'my_revese_url' %}">Menu item</a></li> </ul> </div>; } You could create a script tag in your page to inject the values from Django into an array. <script> var menuItems = [ {title: 'Menu Item', url: '{% url "my_reverse_url" %}'}, {title: 'Another Item', url: '{% url "another_reverse_url" %}'}, ]; </script> You could then pass the array into the menu

I am trying to display a google map with a marker. I am using React.js. The map displays in the correct location, but the marker does not show and I get multiple 'object is not extensible' error in the browser console The code looks like this /** @jsx React.DOM */ var Map = React.createClass({ initialize: function() { var lat = parseFloat(this.props.lat); var lng = parseFloat(this.props.lon); var myPosition = new google.maps.LatLng(lat,lng); var mapOptions = { center: myPosition, zoom: 8 }; var map = new google.maps.Map(this.getDOMNode(), mapOptions); var marker = new google.maps.Marker(

What is the correct syntax to handle nested conditional logic in a React component? React.createClass render: -> <div> {if @props.showList {for item in @props.myItems {item} } else } </div> The for loop (on its own) can be rendred; the if/else conditional (on its own) can be rendered. However, nesting the for loop inside the conditional fails. Any help would be very much appreciated. I haven't tested it, but based on how normal JSX works you only need the {expression} thing to escape from JSX mode. The program starts in JS mode (or CS here), and when an element tag is encountered it enters JSX