简体   繁体   English

将数据从React组件传递到Laravel控制器

[英]Passing data from React component to Laravel controller

I a laravel project using React js for the font-end , i would like to pass some data rendered by a React component to my controller. 我是一个使用React js作为font-end的laravel项目,我想将React组件渲染的一些数据传递给我的控制器。 In a blade template i have a form , and within that form , i'm displaying a "select" element using React js. 在刀片模板中,我有一个表单,并且在该表单中,我正在使用React js显示一个“ select”元素。 How to pass the value in the select element via the Request(Request $request) variable to the controller? 如何通过Request(Request $ request)变量将select元素中的值传递给控制器​​? Here is my form in the blade template: 这是刀片模板中的表格:

<form method="POST" action="">
        @csrf

    <div id="example" data={{ $currencies }}></div>

    <input type="submit" value="Create" class="btn btn-primary">
</form>

And there is the component: 并且有组件:

class Example extends Component {
    render() {
                return(
            <div>
          <select>
            <option></option>
            <option>Currency</option>
            <option>Reputation</option>
          </select>

        </div>
            );

            }
  }

export default Example;

if (document.getElementById('example')) {
     var data = document.getElementById('example').getAttribute('data');
    ReactDOM.render(<Example data={data}/>, document.getElementById('example'));
}

I guess you can simply send or pass the data to laravel route or controller directly . 我想您可以直接将数据直接发送或传递到laravel路由或控制器。 You can use fetch() method or axios() to send the data in post method to the url and catch that in the respective controller. 您可以使用fetch()方法或axios()将post方法中的数据发送到url,并在相应的控制器中进行捕获。 As react component or can say react is only the view of the MVC that there is no way(may be in my knowledge) to pass the data to server side with a api request like fetch() n all. 作为react组件或可以说react只是MVC的视图,没有办法(可能就我所知)将数据通过fetch()n之类的api请求传递到服务器端。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM