Yossapol / wds-react

Icon

Button components can contain an Icon. This is done by setting the icon property or placing an Icon component within the Button

If you want specific control over the positioning and placement of the Icon, then that should be done by placing the Icon component within the Button rather than using the icon property.

• Edit Online : https://codesandbox.io/s/1o624ny0k7

import React, { Component, Fragment } from 'react'
import { Button } from 'antd'

export default class ButtonIcon extends Component {
  render() {
    return (
      <Fragment>
        <Button type="primary" shape="circle" icon="search" />
        <Button type="primary" icon="search">
          Search
        </Button>
        <Button shape="circle" icon="search" />
        <Button icon="search">Search</Button>
        <br />
        <Button shape="circle" icon="search" />
        <Button icon="search">Search</Button>
        <Button type="dashed" shape="circle" icon="search" />
        <Button type="dashed" icon="search">
          Search
        </Button>
      </Fragment>
    )
  }
}

Property	Description	Type	Deault
type	can be set to primary ghost dashed danger(added in 2.7) or omitted (meaning default)	string	default
disabled	disabled state of button	boolean	false
size	can be set to small large or omitted	string	default
onClick	set the handler to handle click event	(event) => void	-