blazor share list with component code example

Example 1: how to pass property between blazor components

using System;
namespace AppDataService.Services
{
    public class AppData
    {
        private int _number;
        public int Number
        {
            get
            {
                return _number;
            }
            set
            {
                _number = value;
                NotifyDataChanged();
            }
        }

        private string _color;
        public string Color
        {
            get
            {
                return _color;
            }
            set
            {
                _color = value;
                NotifyDataChanged();
            }
        }

        public event Action OnChange;

        private void NotifyDataChanged() => OnChange?.Invoke();
    }
}

Example 2: how to pass property between blazor components

@page "/page2"
@inject Services.AppData AppData

Example 3: how to pass property between blazor components

@page "/page2"
@inject Services.AppData AppData

<h1>Second Page</h1>
<div style="width:640px; height:480px; background-color:@AppData.Color">
    <p>You entered the number @AppData.Number.</p>
</div>

@code {
    protected override void OnInitialized()
    {
        AppData.OnChange += StateHasChanged;
    }
}

Example 4: how to pass property between blazor components

@page "/"
@inject Services.AppData AppData

<h1>First Page</h1>
<input type="number" @bind="AppData.Age" />
<br>
<a href="/page2">Go to Page 2</a>

Tags:

Misc Example