본문 바로가기
728x90
반응형

Blazor11

Blazor WASM] session storage 사용하기 url parameter 로 받은 정보를 browser session storage 에 저장해서 사용해보자 sessionstorage package를 설치한다. dotnet add package Blazored.SessionStorage Program.cs 파일에 sessionstorage service를 등록한다. builder.Services.AddBlazoredSessionStorage(); Index.razor 에 parameter로 받은 name을 sessionstorage에 저장하고, sessionstorage에서 가져온 name을 화면에 표시한다. @page "/" @page "/{name}" @inject Blazored.SessionStorage.ISessionStorageService .. 2021. 9. 9.
Blazor의 .NET 메서드에서 JavaScript 함수 호출 Blazor 앱은 .NET 메서드에서 JavaScript함수를 호출하고, JavaScript함수에서 .NET메서드를 호출할 수 있다. 이것을 JavaScript interop이라고 한다. Blazor의 .NET 메서드에서 JavaScript 함수 호출 1. index.html body 태그안에 script를 추가한다. Loading... An unhandled error has occurred. Reload 🗙 2. index.razor에서 버튼을 클릭하면 showAlert 함수를 호출하도록 한다. .NET에서 JS를 호출하려면 IJSRuntime 추상화를 삽입하고 InvokeVoidAsync 함수를 호출한다. @page "/" @inject IJSRuntime JS Hello, world! Welcom.. 2021. 9. 9.
Visual Studio 2019] Blazor Web Assembly 프로젝트 생성 1. 새 프로젝트 만들기 - Blazor WebAssembly App 선택 - 다음 - 프로젝트 이름 설정 - 만들기 아래의 구조로 프로젝트가 생성된다. 개발자 PowerShell에 dotnet watch run --project TEST 를 실행하면 브라우저가 자동으로 실행되며 기본 사이트를 확인할 수 있다. 2021. 9. 9.
Blazor WASM] JavaScript의 위치 JavaScript의 위치 태그에서 스크립트 로드(일반적으로 권장되지 않음) 태그에서 스크립트 로드 외부 JS 파일(.js)에서 스크립트 로드 Blazor 시작 후 스크립트 삽입 BlazorComponent(.razor) 내부에 태그 추가하면, 에러 발생한다. 태그에서 스크립트 로드 wwwroot/index.html의 태그에 추가 태그에서 스크립트 로드 wwwroot/index.html의 태그에 추가 외부 JS파일(.js)에서 스크립트 로드 스크립트 경로를 사용하여 wwwroot/index.html의 태그에 추가 Blazor 시작 후 스크립트 삽입 ... 2021. 7. 28.
VSCode] ASP.NET Core Blazor App 1. .NET Core 3.1 또는 .NET 5.0 SDK 설치 https://dotnet.microsoft.com/download C# 9.0 사용하려면 .NET 5.0을 설치한다. Download .NET (Linux, macOS, and Windows) Free downloads for building and running .NET apps on Linux, macOS, and Windows. Runtimes, SDKs, and developer packs for .NET Framework, .NET Core, and ASP.NET. dotnet.microsoft.com 2. C# extension for Visual Studio Code 설치 3. Blazor Server 프로젝트 생성 dotne.. 2021. 6. 17.
728x90
반응형