load('https://unpkg.com/codemirror@5.65.17/lib/codemirror.css'); Html::css()->load('https://unpkg.com/codemirror@5.65.17/theme/material.css'); Html::css()->load('https://unpkg.com/codemirror@5.65.17/addon/hint/show-hint.css'); Html::css()->load('https://unpkg.com/codemirror@5.65.17/addon/lint/lint.css'); Html::js()->load('https://unpkg.com/codemirror@5.65.17/lib/codemirror.js'); Html::js()->load('https://unpkg.com/codemirror@5.65.17/mode/javascript/javascript.js'); Html::js()->load('https://unpkg.com/codemirror@5.65.17/addon/hint/show-hint.js'); Html::js()->load('https://unpkg.com/codemirror@5.65.17/addon/edit/closebrackets.js'); Html::js()->load('https://unpkg.com/codemirror@5.65.17/addon/hint/javascript-hint.js'); Html::js()->load('https://unpkg.com/codemirror@5.65.17/addon/lint/lint.js'); Html::js()->load('https://unpkg.com/codemirror@5.65.17/addon/lint/javascript-lint.js'); Html::js()->load('https://unpkg.com/jshint@2.13.2/dist/jshint.js'); Html::css()->addCss(<< * { text-indent: 0; } CSS); $el = El::fromCode(''); $code = El::text(<< { this.setResponse(data); if (typeof data !== 'object'){ return; } if(data.code === 1001){ localStorage.setItem('token', data.data.token); }else if(data.data.hasOwnProperty('token')){ localStorage.setItem('token', data.data.token.token); } }).catch(error => { this.setResponse(error.response.data); }) JS )->setRetraction(0); Html::html()->append( El::double('script') ->setId("requestCode") ->setRetraction(-4) ->setAttr('type', 'text/html') ->append($code) ); Html::js()->vue->addMethod("init", JsFunc::anonymous()->code(<< { if (!localStorage.getItem('requestCode')){ localStorage.setItem('requestCode', document.getElementById('requestCode').innerText); } this.requestScriptEditor.setValue(localStorage.getItem('requestCode')); this.requestScriptEditor.refresh(); }); this.requestScriptEditor.on('change', (codemirror,pos) => { codemirror.refresh() let char = ''; if (pos.origin === '+input' || pos.origin === '*compose'){ char = pos.text[0].substr(-1) }else if (pos.origin === '+delete'){ let lineText = codemirror.getLine(pos.from.line); // 确保光标位置在有效范围内 if (pos.from.ch - 1 < lineText.length) { // 获取光标所在位置的字符 char = lineText.charAt(pos.from.ch - 1); } } if (/\w/.test(char)){ this.requestScriptEditor.showHint(); } localStorage.setItem('requestCode', this.requestScriptEditor.getValue()); }); let charWidth = this.requestScriptEditor.defaultCharWidth(), basePadding = 4; this.requestScriptEditor.on("renderLine", function(cm, line, elt) { var off = CodeMirror.countColumn(line.text, null, cm.getOption("tabSize")) * charWidth; elt.style.textIndent = "-" + off + "px"; elt.style.paddingLeft = (basePadding + off) + "px"; }); JS )); Html::js()->vue->event('mounted', 'this.init()'); return $el;