ชุดส่วนประกอบ UI ระดับองค์กรที่หลากหลายขึ้นอยู่กับการออกแบบมดและ Blazor
ภาษาอังกฤษ | 简体中文
WebAssembly Static Hosting บน:
เนื่องจากข้อ จำกัด ของ WebAssembly, Blazor WebAssembly ไม่รองรับ IE BROWSER แต่ Blazor Server รองรับ IE 11 †พร้อมโพลีฟิลล์เพิ่มเติม ดูเอกสารอย่างเป็นทางการ
จาก. NET 5 คือ 11 ไม่ได้รับการสนับสนุนอย่างเป็นทางการอีกต่อไป ดู Blazor: การสนับสนุนเบราว์เซอร์ที่อัปเดต การสนับสนุนอย่างไม่เป็นทางการจัดทำโดยโครงการชุมชน Blazor.polyfill
ปล่อย:
ทุกคืน:
ดาวน์โหลดการสร้างยามค่ำคืนล่าสุดของเรา
ซิงโครไนซ์กับข้อกำหนดการออกแบบมดอย่างเป็นทางการคุณสามารถตรวจสอบบันทึกการซิงค์ออนไลน์ได้
ดังนั้นคุณสามารถใช้รูปแบบชุดรูปแบบที่กำหนดเองของการออกแบบมดได้โดยตรง
ก่อนที่จะเปิดตัว 1.0 เราจะซิงค์สไตล์ ANTD 4.x เท่านั้น
เราได้จัดเตรียมเทมเพลต dotnet new เพื่อสร้างโครงการหม้อไอน้ำออกจากกล่อง:

ติดตั้งเทมเพลต
$ dotnet new --install AntDesign.Templatesสร้างโครงการ Boilerplate ด้วยเทมเพลต
$ dotnet new antdesign -o MyAntDesignAppตัวเลือกสำหรับเทมเพลต:
| ตัวเลือก | คำอธิบาย | พิมพ์ | ค่าเริ่มต้น |
|---|---|---|---|
-f | --full | หากระบุให้สร้างหน้าการออกแบบมดทั้งหมด | บูล | เท็จ |
-ho | --host | ระบุรูปแบบโฮสติ้ง | 'Webapp' | 'wasm' | 'เซิร์ฟเวอร์' | 'WebApp' |
--styles | ไม่ว่าจะใช้ nodejs และน้อยกว่าเพื่อรวบรวมธีมที่กำหนดเองของคุณ | css | less | css |
--no-restore | หากระบุให้ข้ามการกู้คืนอัตโนมัติของโครงการในการสร้าง | บูล | เท็จ |
ไปที่โฟลเดอร์โครงการของแอปพลิเคชันและติดตั้งการอ้างอิงแพ็คเกจ NUGET
$ dotnet add package AntDesign ลงทะเบียนบริการใน Program.cs
builder . Services . AddAntDesign ( ) ; หรือ Startup.cs
services . AddAntDesign ( ) ; เพิ่มเนมสเปซใน _Imports.razor
@using AntDesignแนะนำไฟล์ CSS และ JS ในสถานที่ที่เหมาะสม โครงการ webapp ได้รับการแนะนำใน app.razor และโครงการ WebAssembly ได้รับการแนะนำใน index.html
< link href =" _content/AntDesign/css/ant-design-blazor.css " rel =" stylesheet " >
< script src =" _content/AntDesign/js/ant-design-blazor.js " > </ script > ในการแสดงส่วนประกอบป๊อปอัพแบบไดนามิกคุณต้องเพิ่มส่วนประกอบ <AntContainer /> ใน App.razor
<Routes /> สำหรับการโต้ตอบ <Routes @rendermode="RenderMode.InteractiveAuto" /> <-- specify the rendermode
+ <AntContainer @rendermode="RenderMode.InteractiveAuto" /> <-- add this component <Router AppAssembly="@typeof(MainLayout).Assembly">
<Found Context="routeData">
<RouteView RouteData="routeData" DefaultLayout="@typeof(MainLayout)" />
</Found>
<NotFound>
<LayoutView Layout="@typeof(MainLayout)">
<Result Status="404" />
</LayoutView>
</NotFound>
</Router>
+ <AntContainer /> <-- add this component ในที่สุดก็สามารถอ้างอิงได้ในองค์ประกอบ .razor !
< Button Type = " @ButtonType.Primary " >Hello World!</ Button >คลิกปุ่มด้านล่างเพื่อเริ่มพื้นที่ทำงานใหม่เพื่อการพัฒนาฟรี
ติดตั้ง. NET CORE SDK 9.0.100 หรือใหม่กว่า
ติดตั้ง node.js (เฉพาะสำหรับการสร้างไฟล์สไตล์และไฟล์ typescript แบบทำงานร่วมกัน)
โคลนเพื่อการพัฒนาในท้องถิ่น
$ git clone https://github.com/ant-design-blazor/ant-design-blazor.git
$ cd ant-design-blazor
$ npm install
$ dotnet build ./site/AntDesign.Docs.Build/AntDesign.Docs.Build.csproj
$ npm startเยี่ยมชม https: // localhost: 5001 ในเบราว์เซอร์ที่คุณสนับสนุนและตรวจสอบเอกสารการพัฒนาท้องถิ่นเพื่อดูรายละเอียด
Visual Studio 2022 ขอแนะนำให้พัฒนา
ตรวจสอบปัญหานี้เพื่อเรียนรู้เกี่ยวกับแผนการพัฒนาของเราสำหรับการเปิดตัว 1.0
นอกจากนี้คุณยังสามารถค้นหาข่าวล่าสุดเกี่ยวกับคุณสมบัติที่เราจะนำไปใช้ในอนาคตด้วยสไตล์ ANTD5.0
หากคุณต้องการมีส่วนร่วมอย่าลังเลที่จะสร้างคำขอดึงหรือให้รายงานข้อผิดพลาดแก่เรา
โครงการนี้เป็นโครงการโอเพ่นซอร์สที่ได้รับอนุญาตจาก MIT เพื่อให้บรรลุการพัฒนาโครงการที่ดีขึ้นและยั่งยืนเราคาดว่าจะได้รับผู้สนับสนุนมากขึ้น เราจะใช้เงินที่ได้สำหรับการดำเนินงานชุมชนและการส่งเสริมการขาย คุณสามารถสนับสนุนเราได้ในวิธีใด ๆ ต่อไปนี้:
เราจะใส่บันทึกการบริจาคโดยละเอียดในรายชื่อผู้สนับสนุน
หากคุณพบปัญหาใด ๆ ในกระบวนการอย่าลังเลที่จะขอความช่วยเหลือผ่านช่องทางต่อไปนี้ นอกจากนี้เรายังสนับสนุนให้ผู้ใช้ที่มีประสบการณ์ช่วยเหลือผู้มาใหม่
โครงการนี้มีอยู่ขอบคุณทุกคนที่มีส่วนร่วม
โครงการนี้ได้นำจรรยาบรรณที่กำหนดโดยพันธสัญญาผู้สนับสนุนเพื่อชี้แจงพฤติกรรมที่คาดหวังในชุมชนของเรา สำหรับข้อมูลเพิ่มเติมโปรดดูจรรยาบรรณ. NET
โครงการนี้ได้รับการสนับสนุนโดย. NET Foundation