Blazor.Components 다운로드 - Blazor.Components 소스 코드 다운로드

Blazor.Components

타사 구성 요소

1.0.0

다운로드

블레이저 구성 요소

내가 작업중 인 일부 블레이저 구성 요소 :

나무
태그 선택기
페이지 패널

실행 예를 참조하십시오 : https://blazorcomponents.z6.web.core.windows.net/

나무

 < Tree 
    Nodes =" Items " 
    SelectedNode =" SelectedItem " 
    ChildSelector =" item => item.Childs " >
    < TitleTemplate > @context.Text </ TitleTemplate >
</ Tree >

클라이언트 종속성

 < link rel =" stylesheet " href =" _content/MW.Blazor.Tree/styles.css " />
< link rel =" stylesheet " href =" https://use.fontawesome.com/releases/v5.8.1/css/all.css " integrity =" sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf " crossorigin =" anonymous " >

코드 예제
코드 예제 (게으른로드)
라이브 데모

특징 / 작업

일반 데이터 지원
항목 템플릿
스타일링 (부트 스트랩/글꼴 굉장)
하위 트리 로딩 표시기 (게으른 하중)
노드 선택 비활성화
단일 선택
멀티 선택 (확인란)
이벤트 인구 (Onselect, Onexpand, ...)
지원 EventCallback <>을 지원합니다

로그 변경

1.3
- 게으른 하중을 처리하려면 새로운 속성 'Onnodeexpand'를 추가하십시오
- 분기 로딩을 표시하려면 새로운 스타일의 'NodeloadingClass'를 추가하십시오
1.2
- 노드를 선택할 수 있는지 평가하기 위해 선택적 특성 'NodedIbled'가 추가되었습니다.
- 새로운 스타일 클래스 'NodetitleSelectableClass'추가 (노드를 선택할 수있는 경우 설정)
- 새로운 스타일 클래스 'NodetitleDisabledClass'추가 (노드가 비활성화 된 경우 설정)
1.1.8
- 'ChildSelector'속성에 대한 기본값을 추가하십시오
1.1.7
- '스타일'을 어린이에게 전달하십시오
1.1.6
- .NET Core 3.0 (최종)으로 업데이트
1.1.4
- .NET Core 3.0-preview9로 업데이트
1.1.3
- .NET Core 3.0-preview8로 업데이트
1.1.2
- .NET Core 3.0-preview6로 업데이트
1.1.1
- 면도기에서 Blazor Lib으로 변환하십시오
1.1.0
- .NET Core 3 Preview4로 업데이트
- 네임 스페이스 MW.Blazor 로 이동하십시오
- EventCallback을 구현하십시오
- 중단 변경 : selectedNodes ( IList<TItem> ) -> selectedNode ( TItem )

태그 선택기

 < TagSelector 
    SelectableTags =" @Tags " 
    SelectedTags =" @Selected " 
    Filter =" @((item,term) => item.Contains(term)) " >
    < TagTemplate > @context </ TagTemplate >
</ TagSelector >

클라이언트 종속성

 < link rel =" stylesheet " href =" _content/MW.Blazor.TagSelector/styles.css " />
< script src =" _content/MW.Blazor.TagSelector/interop.js " > </ script >

코드 예제
라이브 데모

특징 / 작업

로그 변경

1.2.3
- .NET Core 3.0 (최종)으로 업데이트
1.2.1
- .NET Core 3.0-preview9로 업데이트
1.2
- 새 콜백을 추가하여 사용자 입력을 잡고 즉시 태그를 만듭니다 (문제 #1)
1.1.3
- .NET Core 3.0-preview8로 업데이트
1.1.2
- .NET Core 3.0-preview6로 업데이트
1.1.1
- 면도기에서 Blazor Lib으로 변환하십시오
- SelectedTags에 EventCallback을 추가하십시오
1.1.0
- .NET Core 3 Preview4로 업데이트
- 네임 스페이스 MW.Blazor 로 이동하십시오
- EventCallback을 구현하십시오

페이지 패널

 < PagePanel PageIndex =" @CurrentPage " Style =" height:250px " >
    < Page Widths =" 50%;100%;200% " >
        < div class =" d-flex justify-content-center align-items-center h-100 text-white h4 " style =" background:#00ff90 " >
            Page 1
        </ div >
    </ Page >
    < Page Widths =" 50%;30%;20%;50% " >
        < div class =" d-flex justify-content-center align-items-center h-100 text-white h4 " style =" background:#1596c7 " >
            Page 2
        </ div >
    </ Page >
    < Page Widths =" 70%;70%;20%;50% " >
        < div class =" d-flex justify-content-center align-items-center h-100 text-white h4 " style =" background:#b823be " >
            Page 3
        </ div >
    </ Page >
    < Page Widths =" 60%;60%;60%;100% " >
        < div class =" d-flex justify-content-center align-items-center h-100 text-white h4 " style =" background:#ff6a00 " >
            Page 4
        </ div >
    </ Page >
</ PagePanel >

< button onclick =" @(() => CurrentPage--) " > < </ button >
@CurrentPage
< button onclick =" @(() => CurrentPage++) " > > </ button >


@functions { int CurrentPage { get; set; } }

클라이언트 종속성

 < link rel =" stylesheet " href =" _content/MW.Blazor.PagePanel/styles.css " />

코드 예제
라이브 데모

특징 / 작업

같은 페이지의 여러 페이지
'폭'속성에 대한 기본값
전환 시간을위한 속성
'폭'속성을 단순화하십시오

로그 변경

1.1.6
- .NET Core 3.0 (최종)으로 업데이트
1.1.4
- .NET Core 3.0-preview9로 업데이트
1.1.3
- .NET Core 3.0-preview8로 업데이트
1.1.2
- .NET Core 3.0-preview6로 업데이트
1.1.1
- 면도기에서 Blazor Lib으로 변환하십시오
1.1.0
- .NET Core 3 Preview4로 업데이트
- 네임 스페이스 MW.Blazor 로 이동하십시오
- CascadeValue를 사용하여 현재 페이지 인덱스를 제공하십시오