blazor에서 제공하는 razor component 파일에는 UI단과 c#코드를 작성하는 코드 스페이스로 구성되어 있습니다.
하지만 코드가 길어지다 보면 코드 스페이스에 모든 코드를 작성하기 부담스러울때가 있는데요.
이럴때 코드 비하인드 파일을 통해 따로 코드를 관리하는게 편리합니다.
이번 포스팅은 코드 비하인드 파일 생성에 관련된 내용입니다.
예제로 사용할 Test.razor파일을 먼저 생성합니다.
//Test.razor
코드 스페이스단에 작성한 프러퍼티값을 UI단에 출력하는 아주 간단한 코드를 작성 해보았습니다.
(바인딩을 모르시는 분은 해당 포스팅 참조)
output:
우리가 해보고 싶은것은 코드 스페이스 구간에 작성했던 것을 코드 비하인드 파일로 옮겨 똑같이 작동하는지 확인해보고 싶습니다.
그러기에 앞서 코드 비하인드 파일을 만들어어야 겠죠?
새로운 클래스 파일 생성을 합니다.
이때 중요한점은 이름인데요.
razor 파일과 같은 이름을 사용하되, 뒤에 .cs를 추가 해줘야 합니다.
추가버튼을 누르면 자동적으로 razor파일 밑에 .cs파일이 생성되는 것을 알 수 있습니다.
//Test.razor.cs
생성한 class파일에 들어가보면 아래와 같은 에러가 발생할것입니다.
이는 같은 이름의 클래스가 이미 정의되어 있어서 발생하는 에러인데요, partial키워드를 추가해주면 해결이 가능합니다.
(partial 키워드를 모르시는분은 해당 포스팅 참조)
추가적으로 ComponentBase를 상속해줍니다.
ComponentBase정의에 접속해 보면, 코드 스페이스에 주로 사용되는 여러 메소드들이 정의 되어있는걸 알 수 있습니다.
고로 ComponentBase를 통해 코드스페이스와 완전히 같은 환경을 만들었다고 볼 수 있습니다.
//test.razor.cs
마지막으로 아래와 같이 코드 스페이스에 작성했던 코드 그대로 코드비하인드에 적어주시기만 하면 완성입니다!
'c# > blazor' 카테고리의 다른 글
[c# blazor] NavigationManager LocationChanged 이벤트란? (0) | 2022.07.27 |
---|---|
[c# blazor] NavigateTo를 이용한 특정 페이지 이동방법 (0) | 2022.07.26 |
[c# blazor] IJSRuntime이란? (자바스크립트 사용) (0) | 2022.07.25 |
[c# blazor] 바인딩이란 ? (양방향, 단방향) (0) | 2022.07.22 |
댓글