Javascript 带有reactjs和引导的下拉菜单

我很难弄明白如何让这个下拉列表真正起作用。该按钮渲染良好，但不会下拉。你知道我在这里遗漏了什么吗？非常确定我需要一个onClick函数，但不确定要控制什么才能让它下拉

var Dropdownbutton = React.createClass({
displayName: 'Dropdownbutton',
render: function() {
    return el.div(null,
      el.div({className: 'col-xs-12 col-md-6 col-lg-3'},
        el.div({className:'btn-group'},
          el.a({href:'#',className:'btn btn-primary'},'Primary'),
          el.a({href:'#',className:'btn btn-primary dropdown-toggle', "data-toggle":'dropdown'},el.span({className:'caret'},'')),
          el.ul({className:'dropdown-menu'},
            el.li(null,el.a({href:'#'},'Action')),
            el.li(null,el.a({href:'#'},'Another action')),
            el.li(null,el.a({href:'#'},'Something else here')),
            el.li({className:'divider'},''),
            el.li(null,el.a({href:'#'},'Separated link'))
          )
        )
      )
    );
}

});

---

根据我的推断，您没有使用class下拉列表进行除法。对代码做一点小小的修改应该可以

var Dropdownbutton = React.createClass({
displayName: 'Dropdownbutton',
render: function() {
    return el.div(null,
      el.div({className: 'dropdown col-xs-12 col-md-6 col-lg-3'},
        el.div({className:'btn-group'},
          el.a({href:'#',className:'btn btn-primary'},'Primary'),
          el.a({href:'#',className:'btn btn-primary dropdown-toggle', "data-toggle":'dropdown'},el.span({className:'caret'},'')),
          el.ul({className:'dropdown-menu'},
            el.li(null,el.a({href:'#'},'Action')),
            el.li(null,el.a({href:'#'},'Another action')),
            el.li(null,el.a({href:'#'},'Something else here')),
            el.li({className:'divider'},''),
            el.li(null,el.a({href:'#'},'Separated link'))
          )
        )
      )
    );
}

});

---

你可能会发现这非常有帮助。我一直在检查react bootstrap，不确定我遗漏了什么。普通的按钮对我来说没有问题，但是下拉菜单不想工作。你是对的，你需要一个onClick处理程序。特别展示了react bootstrap的方法。基本上，我认为onClick处理程序需要将open类添加到包含下拉列表的对象（带有“btn group”类的对象）中。对不起，我不能给你一个完整的例子。充其量我可以向您展示如何使用react bootstrap。完整的示例要求您在过程中的某个位置保持打开状态，以便您知道是打开还是关闭下拉列表。当然，您可以使用jquery插件引导程序注册它，我相信，但我不建议这样做。