Editor.js 入力したデータをSaveする

記事作成日: 2022-09-21

hello world的なシンプルな一行だけのデータを保存してみます｡

便宜上､ファイルに保存するのではなく､テキストエリアに出力します｡テキスト(json)データが出力されるだけなので､ファイルへの保存は普通にjs等で行ってください｡

editorに文字列を入力後､Saveボタンを押すとテキストエリアにjsonデータが出力されます｡

ソースコード

editorjs = new EditorJS({
	holderId: 'editorjs',
	minHeight : 0
});

document.querySelector("button").onclick = ()=> {
	editorjs.save().then((outputData) => {
		document.querySelector("textarea").value = JSON.stringify(outputData,null,"\t")
	}).catch((error) => {
		console.log('Saving failed: ', error)
	});
}

saveメソッド

editorjs.save()ですべての入力データを取得することができます｡

promiseがreturnされるので､その後にoutputDataを扱うことができます｡

outputDataは以下のような形式のオブジェクトです｡

{
	"time": 1663727164933,
	"blocks": [],
	"version": "2.25.0"
}

blocks[]にblockをどんどん追加していく感じです｡

block

{
	"id": "RfdoIYK3MC",
	"type": "paragraph",
	"data": {
		"text": "ちゃんと食えよ"
	}
}

blockはこのような形が基本となります｡typeを指定して､data.textにデータが格納されます｡

typeにはparagraphの他にもheaderやlistなどいろいろな種類があります｡

参考リンク

• Saving data
• editor.js/saver.ts · codex-team/editor.js · GitHub