Как передать список в качестве параметра на страницу blazor

#list #url #parameters #routes #blazor

#Список #url #параметры #маршруты #blazor

Вопрос:

Я пытаюсь связать две страницы blazor одним нажатием кнопки. Я хочу передать список строк в качестве параметра на другую страницу.

Прямо сейчас я попытался добавить маршрут на нужную страницу:

 @page "/page1/{filterValues}"
 

и в разделе кода я определяю параметр следующим образом:

 [Parameter]
public IEnumerable<String> filterValues { get; set; }
 

На другой странице я просто пытаюсь вызвать URL-адрес со списком в конце следующим образом:

 NavManager.NavigateTo("/page1/" filterValues);
 

Однако это, похоже, не работает. URL-адрес выглядит следующим образом:
https://localhost:5001/page1/System .Коллекции.Generic.List`1[System.Объект].Приведение()

и я получаю эту ошибку в консоли:

 Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
      Unhandled exception rendering component: Unable to set property 'filterValues' on object of type 'Proj.Client.Pages.page1'. The error was: Specified cast is not valid.
System.InvalidOperationException: Unable to set property 'filterValues' on object of type 'Proj.Client.Pages.page1'. The error was: Specified cast is not valid.
 

Кто-нибудь может объяснить, как я могу передать список строк в качестве параметра через url?

Комментарии:

1. Насколько большим будет этот список строк?

2. Ну, в конце концов, я бы хотел отправить 4 разных списка. Самый большой из них будет составлять от 8 до 10 записей.

Ответ №1:

Вы могли бы сериализовать список :

Вызывающий компонент

 <a href="/somepage/@param1/@param2/@param3/@param4">Some Page</a>

@code {
    string[] list1 = new[] { "Id1", "FirstName1", "Surname1" };
    string[] list2 = new[] { "Id2", "FirstName2", "Surname2", "Value.value", "Value", "Value" };
    string[] list3 = new[] { "Id3", "FirstName3", "Surname3", "Value/value", "Value", "Value", "Value", "Value" };
    string[] list4 = new[] { "Id4", "FirstName4", "Surname4", "Value-value", "Value", "Value", "Value" };

    public string param1 => Serialize(list1);
    public string param2 => Serialize(list2);
    public string param3 => Serialize(list3);
    public string param4 => Serialize(list4);

    static string Serialize(string[] source) => 
        System.Net.WebUtility.UrlEncode(System.Text.Json.JsonSerializer.Serialize(source));
}

 

SomePage.razor

 @page "/somepage/{List1Json}/{List2Json}/{List3Json}/{List4Json}"

<h3>SomePage</h3>

<ul>
    @foreach (var item in List1) { <li>@item</li> }
</ul>
<ul>
    @foreach (var item in List2) { <li>@item</li> }
</ul>
<ul>
    @foreach (var item in List3) { <li>@item</li> }
</ul>
<ul>
    @foreach (var item in List4) { <li>@item</li> }
</ul>
@code {
    [Parameter] public string List1Json { get; set; }
    [Parameter] public string List2Json { get; set; }
    [Parameter] public string List3Json { get; set; }
    [Parameter] public string List4Json { get; set; }

    public string[] List1 => Deserialize(List1Json);
    public string[] List2 => Deserialize(List2Json);
    public string[] List3 => Deserialize(List3Json);
    public string[] List4 => Deserialize(List4Json);

    static string[] Deserialize(string source) 
        => System.Text.Json.JsonSerializer.Deserialize<string[]>(System.Net.WebUtility.UrlDecode(source));
}

 

Комментарии:

1. Спасибо, это очень помогает. Вы знаете, как я мог бы сделать эти параметры необязательными? Скажем, например, один раз, когда я хочу передать только List1 и List4, а в другой раз я хочу передать их все снова.

2. @Snoopy111 Оберните списки в класс и сериализуйте его. Передайте его как отдельный параметр.