在同级(组件)之间传递对象

时间:2019-10-07 19:48:48

标签: blazor

说我有一个像这样的第一个组件:

<EditForm Model="@forecasts" OnValidSubmit="@HandleValidSubmit">
    <DataAnnotationsValidator />
    <ValidationSummary />
    <table class="table">
        <thead>
            <tr>
                <th>Id</th>
                <th>Date</th>
                <th>Temp. (C)</th>
                <th>Temp. (F)</th>
                <th>Summary</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var forecast in forecasts)
            {
                <tr>
                    <td><NavLink href="@($"/Edit/")">@forecast.Id</NavLink></td>
                    <td>@forecast.Date.ToShortDateString()</td>
                    <td>@forecast.TemperatureC</td>
                    <td>@forecast.TemperatureF</td>
                    <td><InputText @bind-Value="@forecast.Summary"/></td>
                </tr>
            }
                <button class="btn btn-primary" type="submit">Save</button>
        </tbody>
    </table>
</EditForm>


@code {
    List<WeatherForecast> forecasts;

    protected override async Task OnInitializedAsync()
    {
        forecasts = await Http.GetJsonAsync<List<WeatherForecast>>("https://localhost:5000/WeatherForecast/");
    }
    private async Task HandleValidSubmit()
    {
        // What should be put there???
    }
}

现在,由于我已经检索了预测对象的列表,因此我想将其中一个传递给任何其他组件,例如,如下所示的编辑组件:

@page "/WeatherForecast/Edit/"
@inject HttpClient Http


@code {
    [Parameter]
    WeatherForecast Forecast { get; set; }


    protected override async Task OnInitializedAsync()
    {
        forecast = // **How to pass the forecast object here from the previous one** //
    }
    private async Task HandleValidSubmit()
    {
        await Http.PostJsonAsync($@"https://localhost:5000/WeatherForecast/", Forecast);
    }
}

(实际上,再次获得用于编辑的对象将是浪费和无用的……)

如何使用Blazor实现这一目标?我知道如何传递值等等,但不知道如何如何在同级组件之间传递自定义对象,而目前为止,还没有发现如何做到这一点……

1 个答案:

答案 0 :(得分:0)

您需要的是Routing Parameters

所有组件都有路由,但是您可以在路由中添加可选参数

 void GroceryList::insert( const GroceryItem & item, std::size_t 
 offsetFromTop )       // insert new item at offsetFromTop, which 
 places it before the current item at offsetFromTop
 {
   /**********  Insert into array  ***********************/
   {
     ///////////////////////// TO-DO //////////////////////////////
     /// Unlike the other containers, std::array has no insert() 
     function, so you have to write it yourself. Insert into the 
     array
     /// by shifting all the items at and after the insertion 
     point (offestFromTop) to the right opening a gap in the array 
     that can be populated with the given grocery item.  Remember 
     that arrays have fixed capacity and cannot grow, so make sure
     /// there is room in the array for another item before you 
     start by verifying _groceries_array_size is less than
     /// _groceries_array.size().  If not, throw 
     CapacityExceeded_ex.  Also remember that you must keep track 
     of the number of
     /// valid grocery items in your array, so don't forget to 
     adjust _groceries_array_size.
     ///
     /// open a hole to insert new item by shifting to the right 
     everything at and after the insertion point.
     /// For example:  a[8] = a[7];  a[7] = a[6];  a[6] = a[5];  
     and so on.
     /// std::move_backward will be helpful, or write your own 
     loop.

     /* Trying to use move_backward but doesn't work
     GroceryList._groceries_array *temp = nullptr;
     if( _groceries_array_size >= _groceries_array.size() )
          throw GroceryList::CapacityExceeded_ex( "Container length 
          error" exception_location );
     if( offsetFromTop > _groceries_array_size )
     offsetFromTop = _groceries_array_size;
     std::move_backward( temp + offsetFromTop, temp + 
     _groceries_array_size , temp + _groceries_array_size +1  );

     temp[ offsetFromTop ] = item;

     ++_groceries_array_size;
     */

      size_t i; //my loop that doesn't work
      _groceries_array_size++;
      for(i = _groceries_array.size()-1; i >= offsetFromTop-1; i--)
      {

          _groceries_array[i+1] = _groceries_array[i];
      }
          _groceries_array[offsetFromTop-1] = item;



     /////////////////////// END-TO-DO ////////////////////////////
     }



      /**********  Insert into vector  **********************/
    {
     ///////////////////////// TO-DO //////////////////////////////
    _groceries_vector.insert( std::next( _groceries_vector.begin(), 
     offsetFromTop ), item );
     /////////////////////// END-TO-DO ////////////////////////////
     } 



       /**********  Insert into doubly linked list  **********/
     {
     ///////////////////////// TO-DO //////////////////////////////
     _groceries_dl_list.insert( std::next( 
     _groceries_dl_list.begin(), offsetFromTop ), item );
     /////////////////////// END-TO-DO ////////////////////////////
      }



        /**********  Insert into singly linked list  **********/
      {
     ///////////////////////// TO-DO //////////////////////////////
      _groceries_sl_list.insert_after( std::next( 
      _groceries_sl_list.before_begin(), offsetFromTop ), item );
     /////////////////////// END-TO-DO ////////////////////////////
       }

      // Verify the internal grocery list state is still consistent 
      amongst the four containers
      if( !containersAreConsistant() ) throw 
      GroceryList::InvalidInternalState_Ex( "Container consistency 
      error" exception_location );
       }

一样得到它
@page "/parent"
@page "/parent/{something}"

然后您可以将[Parameter] public string Something { get; set; } 注入另一个组件中,并使用它将数据从一个组件传递到另一个组件

NavigationManager

请查看some related answer