CodeMirror に問題があります。ブレット ビクターの例とカーン アカデミーの機能に似たライブ ナンバー スクラビングを追加しようとしていますが、あまり運がありません。
リンクを投稿することはできませんが、探していることを達成できるこのライブラリ (GitHub のユーザー FWeinb によって作成された) を見つけましたが、数字はenterCodeMirror でプレスなどを行うとすぐに、変数の値が元の値にリセットされます。
私は ReactJS を使用していますが、これを修正する方法がよくわかりません。this.replaceRange
内容が変わるたびに呼び出すというちょっとばかげたことを試みていますが、もっと良い方法があるはずです。これが私のコードのスニペットです。それは私が理想的にしたいものではありませんが、テスト目的のためだけです:
this.cm.on('dblclick', this.handleDblClick.bind(this))
...
handleDblClick() {
let matches = document.querySelectorAll(".cm-number");
let scrub = new Scrubbing (matches[0],
{ driver :
[
Scrubbing.driver.Mouse,
Scrubbing.driver.MouseWheel,
Scrubbing.driver.Touch
]
})
matches[0].addEventListener('DOMSubtreeModified', () => {
//console.log('change detected')
})
}
したがって、現在スクラバーがこれを編集していることはわかっています:<span class="cm-number"></span>
が、実際の基になるデータはスクラバーで更新されておらず、永続化されていません。エディター内の変数の値がスクラバーでライブで更新され、値が新しいアクションで持続するように、ここで何をすべきかについて誰かが光を当てることができますか?