ブロックエディタで独自のidを追加する方法 - 開発者向けフォーラム

RE: ブロックエディタで独自のidを追加する方法

わいひら — Mon, 23 Dec 2019 13:05:51 +0000

うまくいったようでよかったです ?

戸井健吾 — Mon, 23 Dec 2019 09:05:40 +0000

わいひら様

実装できました！

数日悩んでいたので、本当に助かりました。ありがとうございましたm(__)m

戸井健吾 — Fri, 20 Dec 2019 21:10:15 +0000

わいひら様、ソースコードのご提示ありがとうございます！

こちらを参考に試してみます。結果は改めてご報告しますが、取り急ぎ御礼申し上げます

わいひら — Thu, 19 Dec 2019 11:06:45 +0000

一応、現時点でのトグルボックスのソースコードはこんな感じです。
https://notepad.pw/code/gkqr72n8
attributesに対してdateIDという値を設定して、2回目以降はその値を取得するようにしています。

単純にタイムスタンプを挿入するだけならこちらでもできました。

とのことですが、一応タイムスタンプを取得するgetDateID関数も載せておきます。
https://notepad.pw/code/91hbejqlp

戸井健吾 — Thu, 19 Dec 2019 08:52:45 +0000

はじめまして。
戸井と申します

Cocoonカスタマイズのサポート範疇は超えていると思いますが、もし可能であれば助言をいただきたく書き込ませていただきました。

不都合あれば、削除いただけたらと思います。

ブロックエディタで、Cocoonでいうトグルボックスのような機能を実装しようとしていますが、独自のid設定に困っています。

Cocoonでは以下のようにidとforを設定していると思います。

20191218133137" class="toggle-checkbox" type="checkbox"/>20191218133137">トグルボックス見出し

あああ

「20191218133137」に該当する部分は、タイムスタンプを入れているのだと思いますが、これをどのように実装しているのか、教えていただけないでしょうか。

単純にタイムスタンプを挿入するだけならこちらでもできました。

しかし、保存→エディタから抜ける→編集で再表示、という流れになった時、1回目の初回保存時のタイムスタンプとは変わってしまうため、「Block validation」というエラーになってしまい、ブロックエディタが解除されてしまいます

わいひら様は初回保存と同じタイムスタンプを復元して、うまく解決しているのだろうとは思うのですが、この実装方法がしりたく……。

もし可能であれば、Reactをビルドする前の実装をサンプルとしてご開示いただけたりしますと、大変助かります。
※その他の方法でも問題ございません

よろしくお願いしますいたします。