Buttons "Share" on social networks with the number of users to rate for React.
This package requires node >= 4
, but we recommend node >= 8
.
yarn add react-social-btn
import React from 'react';
import {ShareButton, SocialList} from 'react-social-btn';
const Example = () => {
const list = [
{
name: 'vk',
textButton: 'Vkontakte',
utm: '?utm' //optional
},
{
name: 'mail',
textButton: 'My@Mail.ru',
utm: '?utm' //optional
},
{
name: 'ok',
textButton: 'Odnoklassniki',
utm: '?utm' //optional
},
{
name: 'facebook',
textButton: 'Facebook',
utm: '?utm' //optional
},
{
name: 'twitter',
textButton: 'Twitter',
utm: '?utm' //optional
},
{
name: 'telegram',
extButton: 'Telegram',
utm: '?utm' //optional
},
{
name: 'copy',
extButton: 'Copy link',
utm: '?utm', //optional
onClick: () => {
console.log('Link copied')
} //optional
}
];
return (
<>
<ShareButton
title="Share"
style={{
marginBottom: '1em'
}}
className="share"
toCount={true}
list={list}
defaultUrl="https://zaycev.net"
callback={() => console.log('Share click')}
/>
<SocialList
style={{
marginBottom: '1em'
}}
className="share-list"
list={list}
toCount={true}
defaultUrl="https://zaycev.net"
/>
</>
);
};
Name props | Default | Optional props | Description |
---|---|---|---|
title |
Поделиться | Title button | |
style |
Other styles from Button | ||
className |
Extra className from Button | ||
toCount |
true | true/false | Enabled/Disabled count social share |
list |
All social | array | List name and title button |
defaultUrl |
Default Url | ||
callback |
Callback from button click | ||
isSubscribe |
Subscribe to the community |
Name props | Default | Optional props | Description |
---|---|---|---|
style |
Other styles from Button | ||
className |
Extra className from Button | ||
toCount |
true | true/false | Enabled/Disabled count social share |
list |
All social | array | List name and title button |
defaultUrl |
Default Url |
MIT © Zaycev.net