[英]Monaco editor react resize by user (windows style resize)
I'm using monaco-editor, react version, have this code我正在使用 monaco-editor,react 版本,有这段代码
<Editor
height={"100%"}
width={1200}
onChange={handleUserQueryChange}
beforeMount={handleEditorBeforeMount}
onMount={handleEditorDidMount}
options={{
minimap: {
enabled: false,
},
scrollBeyondLastLine: false,
lineNumbers: 'off',
glyphMargin: false,
folding: false,
lineDecorationsWidth: 0,
lineNumbersMinChars: 0,
wordWrap: 'off',
automaticLayout: true
}}
/>
I would like to change the size editor like a window that you open in a normal OS (windows/linux), and moving the content below down.我想更改大小编辑器,就像您在普通操作系统(windows/linux)中打开的窗口一样,并将下面的内容向下移动。
The automaticaLayout that I added doesn't seem to work (I think it something about being responsive).我添加的 automaticaLayout 似乎不起作用(我认为它与响应有关)。
Any ideas?有任何想法吗?
I ended up using the library re-resizable , with this code and it's working:我最终使用库re-resizable ,使用这段代码并且它正在工作:
const [height, setHeight] = useState(10)
<Resizable size={{
width: 1200,
height: height,
}}
onResizeStop={(e, direction, ref, d) => {
setHeight(height + d.height)
}}
>
<Editor
height={height}
width={1200}
options={{
minimap: {
enabled: false,
},
scrollBeyondLastLine: false,
lineNumbers: 'off',
glyphMargin: false,
folding: false,
lineDecorationsWidth: 0,
lineNumbersMinChars: 0,
wordWrap: 'off',
automaticLayout: true
}}
/>
</Resizable>
Note: only changes height in this example but you can add the width as well if needed注意:在此示例中仅更改高度,但您也可以根据需要添加宽度
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.