将对象保存列表发送到另一个控制器以进行组件填充？

Question

我正在尝试建立一个将ReactJS.NET与ASP.NET MVC 4结合使用的网站。我正在尝试通过ActionLink或其他方式将填充了组件的数据从一页上的控制器发送到另一页上的控制器。更好。

我已经尝试检查ReactJS.NET上的文档，但是如果我忽略了其他一些来源，我深表歉意。我知道如何将控制器中的对象填充到ReactJS JSX文件中的组件上，但是我不确定如何将相同的对象通过与ReactJS一起使用的HTML表中的相应ActionLink传递给另一个控制器。 NET脚本。

控制器，我正在尝试将数据传递给：

using AffirmativeServiceSystem.Models;
using AffirmativeSupportSystem.CalendarComponents;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace AffirmativeServiceSystem.Controllers
{
    public class TicketController : Controller
    {
        private static readonly IList<ApptConfirmItem> logs;

        private static readonly IEnumerable<ApptConfirmItem> combined;

        static TicketController()
        {
            logs = new List<ApptConfirmItem>();

            combined = logs;



            //logs.Concat(addAppts);
        }
        // GET: Queue
        public ActionResult Queue()
        {

            return View(combined);
        }
    }
}

控制器填充我将从先前的React组件传递的数据：

public class QueueController : Controller
    {
        private static readonly IList<ApptTaskTicket> tickets;

        private static readonly IEnumerable<ApptTaskTicket> combined;

        static QueueController()
        {
            tickets = new List<ApptTaskTicket>
            {
                new ApptTaskTicket
                {
                    id = Guid.NewGuid(),
                    summary = "Foopy",
                    description = "Please set up Foop Dawg."
                },
                new ApptTaskTicket
                {
                    id = Guid.NewGuid(),
                    summary = "Milk man",
                    description = "Milkman here I come"
                },
                new ApptTaskTicket
                {
                    id = Guid.NewGuid(),
                    summary = "InMode Presentation",
                    description = "Upcoming presentation next month"
                },
            };

            CalendarQuickStart eventFetcher = new CalendarQuickStart();

            IList<ApptTaskTicket> addAppts = eventFetcher.LoadAppointmentTasks();

            tickets.Concat(addAppts);
        }
        // GET: Queue
        public ActionResult Queue()
        {

            return View(combined);
        }
    }

我要从中传递数据的以前的React组件脚本：

class Queue extends React.Component {
    constructor(props) {
        super(props);
        this.state = { data: this.props.initialData };
        this.handleTicketSubmit = this.handleTicketSubmit.bind(this);
    }
    loadTicketsFromServer() {
        const xhr = new XMLHttpRequest();
        xhr.open('get', this.props.url, true);
        xhr.onload = () => {
            const data = JSON.parse(xhr.responseText);
            this.setState({ data: data });
        };
        xhr.send();
    }
    handleTicketSubmit(ticket) {
        const tickets = this.state.data;
        // Optimistically set an id on the new comment. It will be replaced by an
        // id generated by the server. In a production application you would likely
        // use a more robust system for ID generation.
        comment.Id = comments.length + 1;
        const newComments = comments.concat([comment]);
        this.setState({ data: newComments });

        const data = new FormData();
        data.append('Summary', ticket.summary);
        data.append('Description', ticket.description);

        const xhr = new XMLHttpRequest();
        xhr.open('post', this.props.submitUrl, true);
        xhr.onload = () => this.loadTicketsFromServer();
        xhr.send(data);
    }
    componentDidMount() {
        window.setInterval(() => this.loadTicketsFromServer(), this.props.pollInterval);
    }
    render() {
        return (
            <div className="queue">
                <h1>Affirm Queue</h1>



                <TicketList data={this.state.data} />

            </div>
        );
    }
}

class TicketList extends React.Component {
    render() {
        const ticketNodes = this.props.data.map(ticket => (
            <Ticket key={ticket.id}>

                    <td>{ticket.summary}</td> < td > { ticket.description }</td><td>{ticket.currentApptTime}</td>

            </Ticket>
        ));
        const ticketRaw = this.props.data.map(ticket => (
            <tr>
                    <td>{ticket.summary}</td><td>{ticket.id}</td><td>{ticket.description}</td><td>{ticket.currentApptTime}</td>
                </tr>
        ));
        return (
            <div className="ticketList">

                <table id="affirmTable" className="table table-bordered table-hover table-striped">
                    <tbody>
                        {ticketNodes}
                        </tbody>
                </table>
            </div>
        );
    }
}

function createRemarkable() {
    var remarkable = (("undefined" != typeof global) && (global.Remarkable)) ? global.Remarkable : window.Remarkable;
    return new remarkable();
}

class Ticket extends React.Component {
    rawMarkup() {
        var md = createRemarkable();
        var rawMarkup = md.render(this.props.children.toString());
        return { __html: rawMarkup };
    }
    render() {
        return (

                <tr className="ticket" href="">


                        {React.Children.map(this.props.children, (child, i) => {
                            // Ignore the first child
                            return child
                        })}

                </tr>


        );
    }
}

我试图在控制器之间传递的数据模型：

public class ApptTaskTicket : MasterTicket
    {
        public DateTime currentApptTime;
        public string patientName;
        //TODO: Create foreign relationship
        public Guid subjectPrsnlId;
        public string patientPhone;
        public string patientEmail;
        public string preferredContactMethod;
    }

我想知道我是否应该在Queue组件jsx脚本中给定表内的每个“票”子代的href内创建一个对应的ActionLink，但是我确定还有更好的地方，我只是不知道的。有人可以帮我指出正确的方向吗？希望这不会出现过多的过载...