# react-native-webview-richeditor

> ios和android通用的富文本编辑器，基于RN原生的webview实现，安卓4.4一下版本因为postMessage无效所以无法使用，如需兼容android 4.4以下版本请使用react-native-webview-bridge代替RN原生的webview

Latest version **1.0.0** (published 2017-01-17) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-native-webview-richeditor
pnpm add react-native-webview-richeditor
yarn add react-native-webview-richeditor
bun add react-native-webview-richeditor
```

## Health

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

Positive: no vulnerabilities.

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

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.0 |
| Published | 2017-01-17 |
| First published | 2017-01-17 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 13 |
| Author | illegal |
| Maintainers | illegal |
| Keywords | richeditor, webview |

## Links

- npm: https://www.npmjs.com/package/react-native-webview-richeditor
- Repository: https://github.com/IllegalCreed/react-native-webview-richeditor
- Homepage: https://github.com/IllegalCreed/react-native-webview-richeditor#readme
- Issues: https://github.com/IllegalCreed/react-native-webview-richeditor/issues
- npm.io page: https://npm.io/package/react-native-webview-richeditor

## Alternatives

- [ext-list](https://npm.io/package/ext-list.md) — 6.3M weekly downloads
- [@lexical/selection](https://npm.io/package/@lexical/selection.md) — 3.8M weekly downloads
- [@lexical/text](https://npm.io/package/@lexical/text.md) — 3.6M weekly downloads
- [@lexical/clipboard](https://npm.io/package/@lexical/clipboard.md) — 3.0M weekly downloads
- [@tiptap/extension-mention](https://npm.io/package/@tiptap/extension-mention.md) — 3.0M weekly downloads

## Recent versions

- 1.0.0 (latest) — 2017-01-17

## README

# react-native-webview-richeditor

ios和android通用的富文本编辑器，基于RN原生的webview实现，安卓4.4一下版本因为postMessage无效所以无法使用，如需兼容android 4.4以下版本请使用react-native-webview-bridge代替RN原生的webview

## 安装

这版编辑器包含插入图片功能，所以需要事先安装react-native-image-picker

```
npm install react-native-image-picker --save
react-native link
```
之后就可以安装编辑器了

```
npm install react-native-webview-richeditor --save
```
因为编辑器工具栏以来一些字体图标，所以需要安装字体文件
将assets目录拷贝到目标工程的根目录下
在package.json中添加如下配置

```
"rnpm": {
"assets": [
"assets/fonts"
]
},
```
之后运行
```
react-native link
```
一些用户会遇到类似于键盘遮挡等问题，可以安装react-native-keyboard-spacer
安卓最好在AndroidManifest.xml中添加如下配置来屏蔽原生键盘压缩布局的问题

```
...
<activity
android:windowSoftInputMode="stateHidden|adjustPan"
...
```

另外image-picker需要配置一些权限
```
<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
```
## 使用

```
import RichEditor from 'react-native-webview-richeditor';
...
<RichEditor />
```

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