如何在`react-bootstrap`中的DropdownButton组件上添加类名

Question

我使用react-bootstrap以下组件：

import { DropdownButton, MenuItem } from 'react-bootstrap';

当我在组件中使用DropdownButton时，它将创建带有嵌套<button>的<div> <button> 。 如果我在DropdownButton上设置className ，如下所示：

<DropdownButton className='myDropdown'>

类名myDropdown将应用于<button> DOM，如何设置<div> DOM的类名？

Answer 1

import React from 'react';
import ReactDOM from 'react-dom';
import { DropdownButton, MenuItem } from 'react-bootstrap';
require('bootstrap/dist/css/bootstrap.css');

export default class MyMenu extends React.Component {

  render() {
    return (
    <DropdownButton title="Dropdownxs">
      <MenuItem href="#books">cricket</MenuItem>
      <MenuItem href="#podcasts">Podcasts</MenuItem>
      <MenuItem href="#">Football</MenuItem>
      <MenuItem href="#">Hockey</MenuItem>
      <MenuItem href="#addBlog">kabadi</MenuItem>
    </DropdownButton>
    );
  }
}


ReactDOM.render(
  React.createElement(ModuleMenu, null),
  document.getElementById('root')
);