Frage

I am trying to use classSet in React to dynamically create some css. I am just trying to hide a specific link on a dropdown. Here is my class

define(function(require) {
  'use strict';

  var React = require('react');

  var NavDropdown = React.createClass({
    render: function() {
      var cx = React.addons.classSet;
      var classes = cx({
        'hidden': true
      });

      return (
      <ul className="nav navbar-nav navbar-right">
        <li><a href="#blog">Blog</a></li>
        <li className="dropdown">
          <a href="#" className="dropdown-toggle" data-toggle="dropdown">Other <b className="caret"></b></a>
          <ul className="dropdown-menu">
            <li><a className="{classes}" href="#books">Books</a></li>
          </ul>
        </li>
      </ul>
        );
    }
  });

  return NavDropdown;
});

Looking at this example on the docs page, this seems fairly trivial and seems like it should be working, but classes is not getting interpolated and placed into the dom. What am I doing wrong?

War es hilfreich?

Lösung

The className was not supposed to be inside quotes.

It should be the className={classes}

NOT className="{className}"

And then everything works perfectly.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top