带目录功能的文档编辑器

[{"insert":"1.利用富文本编辑器的触发事件“headerchange” 实时获取目录。获取结果如下：text表示目录文本，type值1、2、3、4分别表示一级、二级、三级、四级标题。\n"},{"insert":{"image":"R10580997-3c139f12c68ad540581fa36cb32a113e_17979_387_85.png"}},{"insert":"\n将获取结果作为循环创建时目录的数据来源，通过type区分不同类型的标题。\n\n2.编辑器滚动时，通过“获取子标题位置”得到每一个标题的offsetTop，即每一个标题距离编辑内容区域顶部的位置。\n"},{"insert":{"image":"R10580997-828da87c4aa65b2d0e8ffec739718fae_13239_409_54.png"}},{"insert":"\n\n"},{"insert":{"image":"R10580997-555bb250f0683e5418c8c79c6ccc1450_30939_430_117.png"}},{"insert":"\n若某标题offsetTop大于0，且offsetTop小于当前编辑区域的高度，则该标题为当前页面可视区域对应的标题；否则，该标题的上一个标题为当前页面可视区域对应的标题。\n"},{"attributes":{"width":"226"},"insert":{"image":"R10580997-5191a38aa369dc44d61f9584d61f046f_14086_311_307.png"}},{"insert":"\n\n3.通过编辑器的“跳转至子标题”方法，传入标题id可实现点击目录标题后跳转到相应位置的功能。\n"},{"insert":{"image":"R10580997-2e80ec2a8db8f2eb982a5a121de0e11c_10783_554_47.png"}},{"insert":"\n"}]