https://github.com/banyudu/kedao
React 编辑器,从 braft-editor 修改而来,基于 draft-js 实现
https://github.com/banyudu/kedao
braft-editor draft-js editor kedao react react-editor typescript
Last synced: about 1 year ago
JSON representation
React 编辑器,从 braft-editor 修改而来,基于 draft-js 实现
- Host: GitHub
- URL: https://github.com/banyudu/kedao
- Owner: banyudu
- License: mit
- Created: 2022-01-28T14:36:07.000Z (about 4 years ago)
- Default Branch: main
- Last Pushed: 2023-06-08T05:46:25.000Z (almost 3 years ago)
- Last Synced: 2025-04-06T04:06:30.910Z (about 1 year ago)
- Topics: braft-editor, draft-js, editor, kedao, react, react-editor, typescript
- Language: TypeScript
- Homepage: https://kedao.vercel.app
- Size: 2.02 MB
- Stars: 7
- Watchers: 2
- Forks: 2
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# Kedao(刻刀) 编辑器
kedao 是一个基于 [braft-editor](https://github.com/margox/braft-editor) 修改而来的前端编辑器,底层基于 [draft-js](https://github.com/facebook/draft-js)。
在 Braft-Editor 的基础之上,kedao 做了一些改进工作,如:
1. 重构了 braft-editor 的多个工程,合并成一个大工程,并修改构建产物,从原来的 webpack 打包后的 bundle,改成源码打包。
1. 升级了依赖包和工具链的版本。
1. 改成 Typescript 语言,添加类型定义,方便使用。
## 安装
```bash
npm i kedao
```
## 使用
```jsx
import React, { useState } from "react";
import Editor, {
EditorState,
convertRawToEditorState,
convertEditorStateToRaw,
} from "kedao";
import { useLocalStorage } from "react-use";
function App() {
const [value, setValue] = useLocalStorage(
"kedao-state",
convertEditorStateToRaw(EditorState.createEmpty())
);
const [editorState, setEditorState] = useState(
convertRawToEditorState(value)
);
const handleChange = (newEditorState: EditorState) => {
setEditorState(newEditorState);
setValue(convertEditorStateToRaw(newEditorState));
};
return (
);
}
export default App;
```
更多示例参见 [examples](./examples/)
## 贡献
欢迎任何方式的贡献,issue、文档、翻译等。
[贡献指南](./CONTRIBUTE.md)
## 文档
更多文档见组件官网:[https://kedao.vercel.app](https://kedao.vercel.app)