Steven S.
Steven S.

Reputation: 21

How to change reactstrap dropdown icon?

How to change reactstrap default dropdown icon into my own image icon?

import React, { useState } from 'react';
import { Dropdown, DropdownToggle, DropdownMenu, DropdownItem } from 'reactstrap';

const Example = (props) => {
  const [dropdownOpen, setDropdownOpen] = useState(false);

  const toggle = () => setDropdownOpen(prevState => !prevState);

  return (
    <Dropdown isOpen={dropdownOpen} toggle={toggle}>
      <DropdownToggle caret>
        Dropdown
        </DropdownToggle>
      <DropdownMenu>
        <DropdownItem>Foo Action</DropdownItem>
        <DropdownItem>Bar Action</DropdownItem>
        <DropdownItem>Quo Action</DropdownItem>
      </DropdownMenu>
    </Dropdown>
  );
}

export default Example;

And if possible, please teach me how to use it. Thanks in advance

Upvotes: 0

Views: 1310

Answers (1)

Nisharg Shah
Nisharg Shah

Reputation: 19552

You can use Font Awesome for that.

Here is the project link: https://stackblitz.com/edit/create-react-class-i3dukw?file=index.js

Upvotes: 1

Related Questions