摘要:介绍由于需要用到下的编辑器功能,网上开源的编辑器不多,没有找到合适的,索性自己写一个。编辑器主要功能就是预览,是一款下的编辑器,拥有预览,快捷添加标签,上一步,下一步功能,行号等功能,后续逐步完善更多功能。预览预览源码地址欢迎,欢迎。
介绍
由于需要用到react下的markdown编辑器功能,网上开源的react markdown编辑器不多,没有找到合适的,索性自己写一个。markdown编辑器主要功能就是预览,for-editor是一款react下的markdown编辑器,拥有预览,快捷添加标签,上一步,下一步功能,行号等功能,后续逐步完善更多功能。预览
for-editor预览
for-editor源码地址 欢迎issue,欢迎star。
界面 安装npm install for-editor -S使用
import React, { Component } from "react" import ReactDOM from "react-dom" import Editor from "for-editor" class App extends Component { constructor() { super() this.state = { value: "" } } handleChange(value) { this.setState({ value }) } render() { const { value } = this.state return (Api props) } } ReactDOM.render( , document.getElementById("container") )
name | type | default | description |
---|---|---|---|
placeholder | String | 请输入内容... | 占位文本 |
value | String | - | 输入框内容 |
lineNum | Boolean | true | 是否显示行号 |
name | type | default | description |
---|---|---|---|
onChange | function(e) | - | 内容改变时回调 |
onSave | function(e) | - | 保存时回调 |
name | description |
---|---|
tab | 两个空格缩进 |
ctrl+s | 保存 |
ctrl+z | 上一步 |
ctrl+y | 下一步 |
2019-01-07 v0.0.9
新增上一步,下一步,tab快捷键功能
新增保存功能
优化图标状态
优化页面样式
2018-12-29 v0.0.8
添加行号显示功能
优化快捷插入标签时,光标选中文本内容
修复异步加载数据时编辑框回显问题
优化编辑区域行间距
2018-12-27 v0.0.6
优化图标按钮
修改组件UnMount时错误bug
新增组件placeholder属性
2018-12-26 v0.0.5
添加上一步,下一步按钮及功能
2018-12-25 v0.0.4
修复firefox下显示bug
2018-12-24 v0.0.3
增加全屏功能
修改onChange参数为输入框内容
优化编辑框输入字体
修复快捷插入标签时,滚动条位置bug
修复firefox下显示问题
2018-12-23 v0.0.0
编辑器基础功能,快捷插入markdown标签,预览功能
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/100879.html
摘要:介绍由于需要用到下的编辑器功能,网上开源的编辑器不多,没有找到合适的,索性自己写一个。编辑器主要功能就是预览,是一款下的编辑器,拥有预览,快捷添加标签,上一步,下一步功能,行号等功能,后续逐步完善更多功能。预览预览源码地址欢迎,欢迎。 介绍 由于需要用到react下的markdown编辑器功能,网上开源的react markdown编辑器不多,没有找到合适的,索性自己写一个。markd...
摘要:最近在学,准备配合搭个博客,找了很多富文本编辑器,都不是很适合用,后来看到一篇搭建博客的文章,里面使用的地址,完全就符合我的想法啊,界面简洁大方还有预览功能。 最近在学nodejs,准备配合react+mongodb搭个博客,找了很多富文本编辑器,都不是很适合react用,后来看到一篇vue+node搭建博客的文章,里面使用的simplemde(github地址),完全就符合我的想法啊...
摘要:常用必备让资源树目录加上图标,必备良品自动路劲补全,默认不带这个功能的格式化代码使用指南按然后输入选择你要格式的文件类型格式后丰富的日志插件让括号拥有独立的颜色,易于区分。可以配合任意主题使用。 常用必备: 1.vscode-icon 让 vscode 资源树目录加上图标,必备良品! showImg(https://segmentfault.com/img/bV22ed?w=295...
摘要:常用必备让资源树目录加上图标,必备良品自动路劲补全,默认不带这个功能的格式化代码使用指南按然后输入选择你要格式的文件类型格式后丰富的日志插件让括号拥有独立的颜色,易于区分。可以配合任意主题使用。 常用必备: 1.vscode-icon 让 vscode 资源树目录加上图标,必备良品! showImg(https://segmentfault.com/img/bV22ed?w=295...
阅读 2996·2023-04-25 20:09
阅读 3302·2021-11-23 09:51
阅读 1957·2021-11-22 15:25
阅读 3330·2021-11-18 10:02
阅读 2733·2021-09-27 13:56
阅读 1289·2019-08-30 15:44
阅读 1137·2019-08-30 13:21
阅读 3294·2019-08-30 11:05