byted-girls-components
npm install -S byted-girls-components
或者
yarn add byted-girls-components
FansGift
用法
// 入口文件 index.js
import 'byted-girls-components/lib/all.css';
// 页面组件 Biz.jsx
import { FansGift } from 'byted-girls-components';
class Biz extends React.PureComponent {
render() {
return (
<FansGift
isLogin={isLogin}
activity={activity}
activityId={activityId}
joinActivity={joinActivity}
registerShare={registerShare}
share={share}
sendAppLog={sendAppLog}
openLoginPanel={openLoginPanel}
/>
);
}
}属性解释
- isLogin: PropTypes.bool.isRequired
- activity: PropTypes.object.isRequired
- activityId: PropTypes.string.isRequired
- joinActivity: PropTypes.func
- registerShare: PropTypes.func
- share: PropTypes.func
- sendAppLog: PropTypes.func
- openLoginPanel: PropTypes.func
其中 joinActivity, registerShare, share, sendAppLog, openLoginPanel 的默认实现是 noop
activity 的结构请参考 https://mock.bytedance.net/mock/5af25a0c1e32614dd999f170/girls/web/activity/gift/api#!method=get
Toast
import { Toast } from 'byted-girls-components';
Toast.show('Hello World');Modal
import { Modal } from 'byted-girls-components';
class MyComponent extends React.PureComponent {
visible = true;
closeModal = () => {
this.setState({visible: false})
};
render() {
return (
<Modal visible={visible} onClick={this.closeModal}>
<p> Hello World </p>
</Modal>
)
}
}Image
自动检测 process.env.PUBLIC_URL，需要的时候，加上这个前缀
import { Image } from 'byted-girls-components';
<Image src="/image/foo.png" />