建站
咨詢
售后
建站咨詢
新聞中心
這篇文章給大家分享的是有關(guān)ant-design vue怎么用的內(nèi)容。小編覺得挺實(shí)用的，因此分享給大家做個參考。一起跟隨小編過來看看吧。
創(chuàng)新互聯(lián)堅(jiān)持“要么做到，要么別承諾”的工作理念，服務(wù)領(lǐng)域包括：網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù)，滿足客戶于互聯(lián)網(wǎng)時代的邵東網(wǎng)站設(shè)計(jì)、移動媒體設(shè)計(jì)的需求，幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴！
ant design vue是能使用的，因?yàn)閍nt design vue是使用Vue實(shí)現(xiàn)的遵循Ant Design設(shè)計(jì)規(guī)范的高質(zhì)量UI組件庫，用于開發(fā)和服務(wù)于企業(yè)級中后臺產(chǎn)品。
Ant Design Vue 是使用 Vue 實(shí)現(xiàn)的遵循 Ant Design 設(shè)計(jì)規(guī)范的高質(zhì)量 UI 組件庫，用于開發(fā)和服務(wù)于企業(yè)級中后臺產(chǎn)品。
特性
提煉自企業(yè)級中后臺產(chǎn)品的交互語言和視覺風(fēng)格。
開箱即用的高質(zhì)量 Vue 組件。
共享 Ant Design of React 設(shè)計(jì)工具體系。
支持環(huán)境
現(xiàn)代瀏覽器和 IE9 及以上（需要 polyfills）。
支持服務(wù)端渲染。
安裝
使用 npm 或 yarn 安裝
我們推薦使用 npm 或 yarn 的方式進(jìn)行開發(fā)，不僅可在開發(fā)環(huán)境輕松調(diào)試，也可放心地在生產(chǎn)環(huán)境打包部署使用，享受整個生態(tài)圈和工具鏈帶來的諸多好處。
$ npm install ant-design-vue --save $ yarn add ant-design-vue
如果你的網(wǎng)絡(luò)環(huán)境不佳，推薦使用 cnpm。
組件庫使用了 vue 的新特性slot-scope(2.5.0新增), provide / inject(2.2.0新增)
瀏覽器引入
在瀏覽器中使用 script 和 link 標(biāo)簽直接引入文件，并使用全局變量 antd。
我們在 npm 發(fā)布包內(nèi)的 ant-design-vue/dist 目錄下提供了 antd.js antd.css 以及 antd.min.js antd.min.css。你也可以通過 https://www.jsdelivr.com/package/npm/ant-design-vue 或 UNPKG 進(jìn)行下載。
強(qiáng)烈不推薦使用已構(gòu)建文件，這樣無法按需加載，而且難以獲得底層依賴模塊的 bug 快速修復(fù)支持。
注意：引入 antd.js 前你需要自行引入 moment。
示例
import Vue from 'vue'
import { DatePicker } from 'ant-design-vue';
Vue.component(DatePicker.name, DatePicker)引入樣式：
import 'ant-design-vue/dist/antd.css'; // or 'ant-design-vue/dist/antd.less'
按需加載
下面兩種方式都可以只加載用到的組件。
使用 babel-plugin-import（推薦）。
// .babelrc or babel-loader option
{
"plugins": [
["import", { "libraryName": "ant-design-vue", "libraryDirectory": "es", "style": "css" }] // `style: true` 會加載 less 文件
]
}注意：webpack 1 無需設(shè)置 libraryDirectory。
然后只需從 ant-design-vue 引入模塊即可，無需單獨(dú)引入樣式。等同于下面手動引入的方式。
// babel-plugin-import 會幫助你加載 JS 和 CSS
import { DatePicker } from 'ant-design-vue';手動引入
import DatePicker from 'ant-design-vue/lib/date-picker'; // 加載 JS import 'ant-design-vue/lib/date-picker/style/css'; // 加載 CSS // import 'ant-design-vue/lib/date-picker/style'; // 加載 LESS
關(guān)于 ant-design-vue
眾所周知，Ant Design作為一門設(shè)計(jì)語言面世，經(jīng)歷過多年的迭代和積累，它對UI的設(shè)計(jì)思想已經(jīng)成為一套事實(shí)標(biāo)準(zhǔn)，受到眾多前端開發(fā)者及企業(yè)的追捧和喜愛，也是React開發(fā)者手中的神兵利器。希望ant-design-vue能夠讓Vue開發(fā)者也享受到Ant Design的優(yōu)秀設(shè)計(jì)。
ant-design-vue 是 Ant Design 的Vue實(shí)現(xiàn)，組件的風(fēng)格與Ant Design保持同步，組件的html結(jié)構(gòu)和css樣式也保持一致，真正做到了樣式0修改，組件API也盡量保持了一致。
感謝各位的閱讀！關(guān)于ant-design vue怎么用就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，讓大家可以學(xué)到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！
分享題目：ant-designvue怎么用
本文地址：http://www.dlmjj.cn/article/jgosii.html
