Deveextreme的UI庫(kù)在做復(fù)雜圖表方面比較強(qiáng)大叮叹，配合Ionic來(lái)做企業(yè)數(shù)據(jù)分析问畅，后臺(tái)管理等應(yīng)用得心應(yīng)手娃属。加上官方支持非常及時(shí)，提問(wèn)一般在1-2小時(shí)就得到回復(fù)按声，大家可以了解一下膳犹。Devextreme詳細(xì)功能我在這里就不詳細(xì)介紹了，如果不了解的同學(xué)可以直接前往官網(wǎng)查看Demo.?
官網(wǎng)機(jī)票??：https://js.devexpress.com/?
首先當(dāng)然少不了Ionic項(xiàng)目签则，這里先創(chuàng)建一個(gè)空白項(xiàng)目
$ ionic start PorjectName blank
項(xiàng)目創(chuàng)建好以后须床，安裝依賴包
$ npm install --save devextreme devextreme-angular
接著需要關(guān)聯(lián)樣式，可以通過(guò)下面兩種方法進(jìn)行關(guān)聯(lián)：
? ? 1. 手動(dòng)復(fù)制渐裂。復(fù)制"node-modules\devextreme\dist\css"文件夾和里面的樣式文件到項(xiàng)目的"www\assets\css"文件夾內(nèi)豺旬。
? ? 2. 項(xiàng)目編譯的時(shí)候自動(dòng)復(fù)制。在項(xiàng)目根目錄創(chuàng)建一個(gè)名為"copy.config.js"的JavaScript文件柒凉。復(fù)制下面代碼到文件里面族阅。
var copy = require('@ionic/app-scripts/config/copy.config.js');
copy.copyStyleSheets = {
src: ['{{ROOT}}/node_modules/devextreme/dist/css/**/*'],
dest: '{{WWW}}/assets/css'
};
module.exports = copy;
在“package.json”中添加一塊代碼，指向剛剛創(chuàng)建的文件膝捞。
"config" : { "ionic_copy": "./copy.config.js" },
然后再項(xiàng)目的"src\index.html"中添加樣式引用
<link href="assets/css/dx.common.css" rel="stylesheet">
<link href="assets/css/dx.light.css" rel="stylesheet">
到目前為止坦刀，Devextreme庫(kù)已經(jīng)添加完成，接下來(lái)就是添加一些組件到項(xiàng)目的頁(yè)面了蔬咬。組件的代碼可以參照官網(wǎng)Demo鲤遥。
運(yùn)行
ionic serve
