I’m using CodeMirror with Vue. I am trying to make it so i can turn on/off line numbers. I have it working except when i turn on line numbers from after it is off, it doesn’t update visually until you change some state.
I make a Compartment for line numbers to initiate it at instantiation of CodeMirror:
getLineNumbersExension() {
if (this.lineNumbers) {
return lineNumbers();
} else {
return [];
}
}
const lineNumbersExtension = this.lineNumbersComp.of(this.getLineNumbersExension());
this.editorView = new EditorView({
state: EditorState.create({
doc: this.code,
extensions: [... lineNumbersExtension ...],
}),
parent: this.$el,
});
Then if this.lineNumbers
changes i do:
updateLineNumbersExtension() {
this.editorView.dispatch({
effects: this.lineNumbersComp.reconfigure(this.getLineNumbersExension()),
});
}
Here is what it looks like:
So the main question is if there a better way to turn off line numbers other than reconfiguring the Compartment with just a []
? Or is there a bug in the gutter code for updating the view?
Thanks!