# xn-react-native-applets

> react-native

Latest version **0.1.3** (published 2019-02-27) · ISC license · 0 weekly downloads

## Install

```sh
npm install xn-react-native-applets
pnpm add xn-react-native-applets
yarn add xn-react-native-applets
bun add xn-react-native-applets
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.3 |
| Published | 2019-02-27 |
| First published | 2018-12-29 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 7 |
| Unpacked size | 299.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Justin Xu |
| Maintainers | justinxu |

## Links

- npm: https://www.npmjs.com/package/xn-react-native-applets
- npm.io page: https://npm.io/package/xn-react-native-applets

## Dependencies (7)

- [md5](https://npm.io/package/md5.md) ^2.2.1
- [react](https://npm.io/package/react.md) 16.0.0-alpha.12
- [react-native](https://npm.io/package/react-native.md) 0.47.2
- [js-root-toast](https://npm.io/package/js-root-toast.md) ^0.2.4
- [react-navigation](https://npm.io/package/react-navigation.md) 1.0.0-beta.31
- [styled-components](https://npm.io/package/styled-components.md) ^3.3.3
- [react-native-actionsheet](https://npm.io/package/react-native-actionsheet.md) ^2.4.2

## Recent versions

- 0.1.3 (latest) — 2019-02-27
- 0.1.2 — 2019-01-25
- 0.1.1 — 2019-01-04
- 0.1.0 — 2018-12-29
- 0.0.1 — 2018-12-29

## README

### xn-react-native-applets

包含：

1. URL配置文件
2. 通用头部组件
3. 通用关于页面相关逻辑
4. 基本方法库

### 项目结构
```html
|--src     源文件
  |--components     组件
    |--CommStatusBar     通用statusBar
    
  |--img            静态资源
  
  |--utils          工具文件夹
  
  |--config.js      小程序配置文件
  |--index.js       插件导出js文件

|--package.json
|--README.md
```

### 如果集成通用头部到目前项目

1. 首先导出关于页面
```
import { AboutScreen } from 'xn-react-native-applets';

// 然后配置到你需要的页面, 路由请自定义
const RootRouteConfig = {
  [routers.authLoading]: { screen: AuthLoadingScreen },
  [routers.about]: { screen: AboutScreen }, // <-- this
  [routers.tabView]: { screen: TabBarStack },
};

```


2. 对首页使用右侧小程序图标, 然后在小程序后侧导入此文件

```
// 首先导入
import { TopRightView } from 'xn-react-native-applets';

// 然后把配置文件 右侧设置为小程序头部, 这里注意 这里的onPress 只绑定关于页面的事件,
CRM.navigationOptions = ({ navigation }) => ({
  title: 'CRM',
  headerRight: (
    <TopRightView
      onPress={() => navigation.navigate(routers.about)}
    />
  ),
});

```

---
_Source: https://npm.io/package/xn-react-native-applets · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._