@linkdesign/screen/lib/fullscreen-switch/README.md

屏组件库，但使用场景又不局限于屏。主要用于BI、大盘和屏

# 全屏切换 FullscreenSwitch

## 使用场景

全屏切换按钮



## 预览

![全屏切换 FullscreenSwitch](https://intranetproxy.alipay.com/skylark/lark/0/2020/png/111014/1580803280286-0ab2dc65-9cf4-4160-86be-bb390a1f71fe.png)     



## 演示

<!--before-content-->

## 基础用法

```js
import { config, Other } from '@linkdesign/screen';

const { FullscreenSwitch } = Other;
const { _cssPrefix } = config;

class App extends React.Component {
  render() {
    return (
      <FullscreenSwitch
        className={`${_cssPrefix}main-body`}
        target="#root"
        local={{
          default: '大屏模式',
          active: '退出大屏',
        }}
      />
    );
  }
}

ReactDOM.render(<App />);
```

<!--after-content-->



### API

| 参数名                    | 说明         | 必填 | 类型                                                 | 默认值 | 备注 |
| ------------------------- | ------------ | ---- | ---------------------------------------------------- | ------ | ---- |
| className       | 类名         | N    | String                                  | -                                                    |              |
| target | 被全屏的目标容器（id或者element） | Y | String/HTMLElement | - |  |
| [local](#local) | 文案配置 | N | Object | {"default":"全屏模式","active":"退出全屏"} |  |
| onChange | 切换回调 | N | Function<br />(isFullscreen: boolean) => void; | - |  |
| ... | 同Title属性 | N | ITitle | textStyle: {fontWeight: 400} |  |

#### local

```typescript
// 文案配置
local?: {
	default: string | React.ReactNode;
	active: string | React.ReactNode;
},
```


## TODO List

- [ ] ......