Server Project 생성 https://yogingang.tistory.com/131 Blazor Server Create Project 1. VisualStudio 2022 새 프로젝트 만들기 선택 2. Blzor Server App 선택 Next 3. Project name 및 Loacation 설정 Next 4. Framework 및 추가 정보 입력 Create 5. Project 구성 wwwroot 앱의 퍼블릭 정적.. yogingang.tistory.com Serilog 추가 개발자 프롬프트에서 프로젝트 폴더로 이동 (현재 .sln 파일이 있는 폴더라면 .csproj 파일이 있는 폴더로 이동) 아래 명령 실행 dotnet add package Serilog.AspNetCore dotnet..

람다식 람다식을 이용하여 이벤트 처리기로 사용할 수 있다. @page "/event-handler-lambda" @heading Update heading @code { private string heading = "Initial heading"; } for 루프 에서 람다식을 이용하고 for 루프의 increase index 를 사용할 경우 변수를 capture 해야 한다. @page "/event-handler-lambda-for" @heading @for (var i = 1; i < 4; i++) { var buttonNumber = i; Button #@i } @code { private string heading = "Select a button to learn its position"; pri..

Razor 구성 요소 태그에서 이벤트 처리기 지정 방법 @on{DOM EVENT}="{DELEGATE}" {DOM EVENT} : DOM(문서 개체 모델) 이벤트 (예: click) {DELEGATE} : C# 대리자 이벤트 처리기 Task를 반환하는 비동기 대리자 이벤트 처리기가 지원된다. 대리자 이벤트 처리기는 UI 렌더링을 자동으로 트리거하므로 StateHasChanged를 수동으로 호출할 필요가 없다. 예외가 기록됩니다. Pages/EventHandlerExample1.razor @page "/event-handler-example-1" @currentHeading New title Update heading @checkedMessage @code { private string currentHea..

여러 중첩된 구성 요소에 바인딩 Pages/Parent.razor @page "/multi-binding/parent" Parent Component Parent Message: @parentMessage Change from Parent @code { private string parentMessage = "Initial value set in Parent"; private void ChangeValue() { parentMessage = $"Set in Parent {DateTime.Now}"; } } Pages/Child.razor Child Component Child Message: @ChildMessage Change from Child @code { [Parameter] public stri..

구문 분석할 수 없는 값 사용자가 데이터 바인딩된 요소에 구문 분석할 수 없는 값을 제공하면 바인딩 이벤트가 트리거될 때 구문 분석할 수 없는 값이 자동으로 이전 값으로 되돌아간다. Pages/UnparsableValues.razor @page "/unparseable-values" inputValue: @inputValue @code { private int inputValue = 123; } 위 내용에서 다음과 같이 @bind:event="oninput" 으로 변경 하시면 input 에 아주 간단하게 int 를 제외하고는 입력할 수 없게 만들 수 있다. 변경된 아래에 예제를 보자 @page "/unparseable-values" // decimalValue.ToString("0.000", cultur..

Razor 구성 요소는 필드, 속성, Razor 식 값을 사용하여 @bind Razor 지시문 특성에 데이터 바인딩 기능을 제공합니다. Pages/Bind.razor 속성 및 Field 에 바인딩하는 예제. focus 가 input 에서 사라지면 ui 가 rendering 되며 속성 또는 필드가 update 된다. @page "/bind" inputValue: @inputValue InputValue: @InputValue @code { private string? inputValue; private string? InputValue { get; set; } } Pages/BindTheory.razor 다음은 Blazor @bind 가 실제 HTML 로 작성되는 방식을 보여준다. @page "/bind-..