VueJS: Добавление проверки пользовательской схемы в Monaco Editor. - PullRequest
Новая
       9

VueJS: Добавление проверки пользовательской схемы в Monaco Editor.

0 голосов
/ 11 мая 2018

Я использую vuejs с машинописью для создания компонента, основанного на Monaco Editor json validation , пока он работает нормально и правильно отображает, но у меня небольшая проблема, которую я не могу предоставитьПроверка пользовательской схемы в редакторе Monaco. На данный момент это моя реализация, но когда я передаю схему в качестве файла prop.inx редактору Monaco, она не работает, любая помощь будет принята с благодарностью.

Файл Parent.tsx, в котором я использую редактор Monaco и определил опору 

data() {
        const id = 'foo.json';
        const validCardSchema = [{
            uri: 'http://myserver/foo-schema.json',
            fileMatch: [id],
            schema: {
                type: 'object',
                properties: {
                    p1: {
                        enum: ['v1', 'v2']
                    },
                    p2: {
                        $ref: 'http://myserver/bar-schema.json'
                    }
                }
            }
        }, {
            uri: 'http://myserver/bar-schema.json',
            fileMatch: [id],
            schema: {
                type: 'object',
                properties: {
                    q1: {
                        enum: ['x1', 'x2']
                    }
                }
            }
        }];

        return {
            jsonEditorText: JSON.stringify(editorCode),
            validCardSchema
        };
}

<TMonacoEditor
    width="400"
    height="400"
    language="json"
    style="border: none;"
    code={this.MonacoEditorText}
    onCodeChange={newVal => this.updateMonacoEditorText(newVal)} />

И файл

child.tsx, в котором функционал редактора Monacoопределяется 

createMonaco() {
            debugger;

            this.editor = monaco.editor.create(this.$el, this.editorOptions);
            this.editor.onDidChangeModelContent(event =>
                this.$emit('codeChange', this.editor.getValue())
            );

            console.log(this.cardSchema);
            monaco.languages.json.jsonDefaults.setDiagnosticsOptions({
                validate: true,
                schemas: this.cardSchema
            });

            this.monaco = monaco;

        }
    },
    render(h): VNode {
        return <div style={this.style} />;
    }

Таким образом, указанное выше условие не показывает никакой ошибки проверки, даже если я передаю неправильные свойства json, которые не определены в схеме props.

monaco.languages.json.jsonDefaults.setDiagnosticsOptions ({validate: true, schemas: this.cardSchema});

...