将值从React表单传递到控制器并显示结果

本文关键字：控制器 显示 结果 React 表单 | 更新日期: 2023-09-27 17:58:17

我有一个关于使用react的问题，我在C#中设置了一个函数，该函数有一个通过URL获取值的控制器。

这是控制器：

[HttpGet("{number}/{source}/{aux}/{destination}")]
    public string Get(int number, string source, string aux, string destination)
    {
        Hanoi h = new Hanoi();
        return h.MoveDisks(number, source, aux, destination);
    }

这就是我迄今为止所尝试的：

<script type="text/babel">
   var Form = React.createClass({
    calculate: function () {
      var xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
         if (xhttp.readyState == 4 && xhttp.status == 200) {
           document.getElementById("moves").innerHTML = xhttp.responseText;
    }
    };
     xhttp.open("GET", "api/values" + "/" + "number" + "/" + "src" + "/" + "aux" + "/" + "dest", true);
     xhttp.send();
    },
     render: function (){
        return (
    <div>
        Number of rings: <input type="number" id="number"/> <br /><br />
        Source: <input type="text" id="src"/><br /><br />
        Auxiliary: <input type="text" id="aux"/><br /><br />
        Destination: <input type="text" id="dest"/><br /><br />
        <button onClick={this.calculate}>Get Result!</button>
    </div>
        );
    }
    });
    ReactDOM.render(<Form />, document.getElementById('form'));
</script>
<div id="form"></div>
<div id="moves"></div>

我希望将结果发布在"moves"div中，但不知道如何发布。我是否试图以一种不应该起作用的方式使用React？

我是一个初学者，所以任何帮助都很感激。

将值从React表单传递到控制器并显示结果

您需要更正api路由

    [HttpGet]
    [Route("api/values/{number}/{source}/{aux}/{destination}")]
    public string Get(int number, string source, string aux, string destination)
    {
        Hanoi h = new Hanoi();
        return h.MoveDisks(number, source, aux, destination);
    }
相关文章：