UNPKG

2.32 kBMarkdownView Raw
1# 协作组件
2
3## 参数说明
4```ts
5interface IProps {
6 id: string | number; //feed_id 无默认
7 isShowHead?: boolean; //是否显示头部 默认 true
8 isOpenReward?: boolean; //是否开通打赏 默认false
9 cooperationHeadName?: string; //协作组件title名称 默认“协作”
10 isShowOperationRecord?: boolean; //是否显示操作记录 默认true
11 extendedComponentsData?: Array<ComponentsData>; //扩展 上部tab扩展
12 userAdvanceMode?: boolean; //是否开启选人组件的高级模式 默认false
13 isShowMentionAllBtn?: boolean; //是否显示@所有同事的按钮 默认true
14 isShowMentionBtn?: boolean; //是否显示@同事按钮 默认true
15 isShowEmojyBtn?: boolean; //是否显示表情包按钮 默认true
16 isShowUploadBtn?: boolean; //是否显示上传按钮 默认 true
17 isExtendBefor?:boolean;// 是否将扩展字段插入到tab前面显示 默认 false
18 operationBtnExternal?: React.ReactElement | React.ReactElement[]; //下方沟通组件的扩展字段
19}
20
21interface ComponentsData{
22 text:string; //显示的名称
23 name:string, //内部标示key值
24 components:ReactNode //下方需要显示的扩展内容
25}
26peerDependencies: {
27 "react": "16.x.x",
28 "react-dom": "16.x.x",
29 "styled-components": "^4.2.0"
30 }
31//注意:组件内部使用Bsglobal里的相关字段,请确保承载页里有tenantInfo(租户信息)、loginUserInfo(用户信息)、apiPath(主站地址)
32```
33##配置说明
34
35## 示例代码
36
37```ts
38// 一般用法
39import * as React from 'react';
40import Cooperation from './../../src/index';
41interface IProps {}
42const Test: React.FunctionComponent<IProps> = () => {
43 const testProps = {
44 id: '12312',
45 isShowHead: false, //是否显示头部
46 isShowOperationRecord: true,
47 isOpenReward: false,
48 cooperationHeadName: '协作',
49 extendedComponentsData: [
50 { text: '扩展', name: 'test', components: <div>test</div> }
51 ],
52 isShowMentionAllBtn: false,
53 userAdvanceMode: true,
54 isShowMentionBtn: false,
55 isShowEmojyBtn: false,
56 isShowVisible: true,
57 operationBtnExternal: <div>扩展按钮</div>
58 };
59 return <Cooperation {...testProps} />;
60};
61
62export default Test;
63
64
65##兼容性说明
661、ie、edge浏览器不支持粘贴上传
672、不支持windows系统下在资源管理器直接复制图片进行粘贴上传,支持截图粘贴上传
68```