我试图在react中创建一个代码编辑器。我已经完成了将console.log值输出到自定义控制台组件的工作。我通过覆盖console.log来做到这一点，但现在我被如何输出卡住了，例如python print: "print('hello')"。console.log
您想在浏览器中创建一个编辑器，它接受python代码并在运行时输出其结果吗?
对于Python，可以使用Brython。
<head>
<script src="https://cdn.jsdelivr.net/npm/brython@3/brython_stdlib.js"></script>
<script src="https://cdn.jsdelivr.net/npm/brython@3/brython.min.js"></script>
<script type="text/python">
from browser import window
def execute(code):
return eval(code)
window.python = execute
</script>
<script>
function runPython() {
const code = document.getElementById('input').value
if (!window.python) {
// Python not loaded yet
return setTimeout(runPython, 1000);
}
const output = window.python(code);
document.querySelector('.output').innerText = output
}
</script>
</head>
<body onload="brython()">
<textarea id="input" rows="4">
1 + 2
</textarea>
<button onclick="runPython()">Run</button>
<pre class="output"></pre>
</body>
在浏览器中创建代码编辑器是一个巨大的挑战。祝你好运!