Kendo UI致力于新的開發(fā)，來(lái)滿足不斷變化的需求。Kendo UI for Vue使用旨在提高性能和豐富用戶體驗(yàn)的Vue組件，幫助開發(fā)人員構(gòu)建下一代應(yīng)用程序。它是為Vue技術(shù)框架提供可用的Kendo UI組件，以便更快地構(gòu)建更好的Vue應(yīng)用程序。

Kendo UI for Vue控件提供了可用于設(shè)置應(yīng)用程序樣式的主題，目前提供以下主題：

• 默認(rèn)主題 — 可通過 @progress/kendo-theme-default NPM 模塊獲得。
• Bootstrap 主題 —— 可通過 @progress/kendo-theme-bootstrap NPM 模塊獲得。
• Material主題 — 可通過 @progress/kendo-theme-material NPM 模塊獲得。

Kendo UI最新正式版下載

安裝

1. 要開始使用主題，請(qǐng)通過 NPM 安裝其包。 例如，要安裝默認(rèn)主題，請(qǐng)運(yùn)行以下命令：

npm install --save @progress/kendo-theme-default

2. 安裝完主題包后，在您的項(xiàng)目中引用它。

在項(xiàng)目中包含主題

每個(gè)主題包都提供了兩種將主題包含在項(xiàng)目中的方法：

• 通過使用預(yù)編譯的 CSS 文件——這種方法不需要構(gòu)建步驟，因此是兩者中速度更快的方法。
• 通過從 SCSS 源文件編譯主題——這種方法減少了 CSS 輸出并允許您自定義主題。

使用預(yù)編譯的 CSS

每個(gè)主題都包含一個(gè)預(yù)編譯的 dist/all.css CSS 文件，其中包含適用所有Kendo UI for Vue組件的樣式。要使用 dist/all.css，請(qǐng)?jiān)趹?yīng)用程序的 App.vue 文件中引用它。

import '@progress/kendo-theme-default/dist/all.css';

雖然使用預(yù)編譯的 CSS 文件比從源代碼編譯主題更快，但該方法具有以下缺點(diǎn)：

• 它包括應(yīng)用程序中未使用組件的CSS。
• 它不提供通過 SCSS 變量自定義主題的選項(xiàng)（當(dāng)您從源代碼構(gòu)建主題時(shí)可以），因?yàn)橹黝}已經(jīng)編譯。

自定義主題

每個(gè)Kendo UI for Vue主題包都包含主題的源文件，這些源文件為您提供了在構(gòu)建過程中修改和重建主題的選項(xiàng)。 例如，您可以更改主題顏色、刪除未使用組件的 CSS 或使用特定主題顏色來(lái)設(shè)置應(yīng)用程序的樣式，主題源文件位于主題包的 scss 文件夾中。

更多自定義主題詳情，請(qǐng)參見這篇文章>>

Kendo UI相關(guān)組件推薦：

• Kendo UI for jQuery ：完整的jQuery UI組件庫(kù)，可快速構(gòu)建出色的高性能響應(yīng)式Web應(yīng)用程序。
• Kendo UI for Angular：專業(yè)級(jí)的Angular UI組件庫(kù)，不僅是將其他供應(yīng)商提供的現(xiàn)有組件封裝起來(lái)，telerik致力于提供純粹高性能的Angular UI組件，而無(wú)需任何jQuery依賴關(guān)系。
• Kendo UI for React：通過React框架的Kendo UI JavaScript封裝來(lái)支持React Javascript框架，能夠?yàn)榭蛻籼峁└玫挠脩趔w驗(yàn)，并且能夠更快地構(gòu)建更好的應(yīng)用程序。

Telerik_KendoUI產(chǎn)品技術(shù)交流群：726377843    歡迎一起進(jìn)群討論