[英]How to remove minimap, scrollbar in Monaco editor and how to disable writing in Monaco editor in react js?
我正在使用带有反应的摩纳哥编辑器。 它工作正常。 但我想删除其中的小地图和滚动条。 我怎样才能删除它们? 我想禁用其中的编辑。 我怎样才能实现这些功能? 请查看图片以供参考 -
代码:
import Editor from "@monaco-editor/react";
export default function TwoSum() {
return (
<div>
{/* Coding Page Content */}
<div className="lg:flex h-full lg:w-12/12 lg:mx-2 mt-12 lg:py-4">
{/* Coding Main Content Start */}
<div className="lg:w-6/12 lg:pr-6 fixed overflow-scroll h-full pb-40">
// social
</div>
{/* Coding Main Content End */}
{/* Coding Right Sidebar Start */}
<div className="lg:w-6/12 lg:pl-4 h-full px-2 mt-2 lg:mt-0 lg:px-0 absolute right-0">
<Editor
height="80vh"
defaultLanguage="javascript"
defaultValue= {code}
className=" overflow-hidden"
readOnly = {true}
// minimap={enabled = false}
// scrollbar={vertical = "hidden"}
/>
</div>
{/* Coding Rightsidebar End */}
</div>
</div>
)
}
const code =
`Here is my code ...
`
创建编辑器时,您可以指定许多选项来控制它的行为和显示:
const options: Monaco.IStandaloneEditorConstructionOptions = {
readOnly: false,
minimap: { enabled: false },
...
};
this.editor = Monaco.create(this.hostRef.current, options);
这是直接使用摩纳哥。 对于@monaco-editor/react,您可以将选项指定为属性:
const options: Monaco.IStandaloneEditorConstructionOptions = {
readOnly: false,
minimap: { enabled: false },
...
};
<Editor
height="80vh"
defaultLanguage="javascript"
defaultValue= {code}
className=" overflow-hidden"
options = {options}
/>
另请参阅: https://www.npmjs.com/package/@monaco-editor/react#editor 。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.