MonacoEditor编辑器⾃动格式代码MonacoEditor代码编辑器怎么实现⾃动格式化代码功能？
1.界⾯上右键下边截图的这个Format Document点击⼀下就好了
2.⽤代码怎么实现呢,⾮只读的情况
// 写法1
const { editor } = ref.current;
editor.setValue('这⾥写要待格式化的数据');
editor.Value());//再次设置
// 写法2
const { editor } = ref.current;
editor.setValue('这⾥写要待格式化的数据');
editor.Value());//再次设置
//写法不同⽬的是⼀样的，上⾯那个⾃动格式化代码的操作，就是上边⽅法截图的那个
/
/ 这个写法需要注意的情况是
// MonacoEditord的配置只能是：readOnly: false,
　// 只读状态下⽆法⽣效代码编辑器怎么下载
3.如果需求是只读的情况怎么处理
// ⽅案1：
// readOnly: true的情况
// setValue前先把数据⾃⼰处理⼀下
const { editor } = ref.current;
editor.setValue(checkJsonCode('待格式化的数据'));
export function checkJsonCode(strJsonCode) {
let res = '';
try {
for (let i = 0, j = 0, k = 0, ii, ele; i < strJsonCode.length; i++) {
ele = strJsonCode.charAt(i);
if (j % 2 === 0 && ele === '}') {
// eslint-disable-next-line no-plusplus
k--;
for (ii = 0; ii < k; ii++) ele = `    ${ele}`;
ele = `\n${ele}`;
} else if (j % 2 === 0 && ele === '{') {
ele += '\n';
// eslint-disable-next-line no-plusplus
k++;
for (ii = 0; ii < k; ii++) ele += '    ';
} else if (j % 2 === 0 && ele === ',') {
ele += '\n';
for (ii = 0; ii < k; ii++) ele += '    ';
// eslint-disable-next-line no-plusplus
} else if (ele === '"') j++;
res += ele;
}
} catch (error) {
res = strJsonCode;
}
return res;
}
// ⽅案2：
那就⽤⼀个div来当做遮罩层覆盖编辑功能，然后把改成readOnly:false

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。