AMIS低代碼平臺(tái),前端開(kāi)發(fā)常見(jiàn)問(wèn)題(樣式篇css style)
最近項(xiàng)目是基于amis低代碼平臺(tái)開(kāi)發(fā)的,在開(kāi)始開(kāi)發(fā)的時(shí)候并未接受系統(tǒng)的學(xué)習(xí),導(dǎo)致開(kāi)發(fā)過(guò)程中遇到很多問(wèn)題。
由于,
部分問(wèn)題在文檔中不能解決,
且,
當(dāng)前搜索引擎找到關(guān)于amis的文檔非常有限。
故,
整理在開(kāi)發(fā)過(guò)程中遇到的問(wèn)題以供參考。
本片主要說(shuō)明的是關(guān)于樣式(css,style)
1.對(duì)于可以在頁(yè)面上能找到配置對(duì)應(yīng)位置的樣式,可以直接配置。

2.對(duì)于個(gè)別需要修正的樣式,可以直接添加在代碼中。頁(yè)面中的組件都可以添加屬于自己的樣式(分欄不支持)。
{ "type": "container", "body": [ { "type": "tpl", "tpl": "專(zhuān)題研究", "inline": true, "wrapperComponent": "h3", "id": "u:ce120b6a0c22", "style": { "color": "#fff" } } ], "size": "xs", "style": { "position": "static", "display": "block", "flex": "1 1 auto", "flexGrow": 1, "flexBasis": "auto" }, "wrapperBody": false, "isFixedHeight": false, "isFixedWidth": false, "id": "u:7bd6e9872d7d" }
上述代碼中,container和tpl都添加了屬于自己的樣式。
敲重點(diǎn):
(1).css中的“-”,需要換成駝峰形式。不支持“flex-grow”這種形式。
(2).在改代碼的時(shí)候,一定要保證代碼正確,否則編譯錯(cuò)誤會(huì)導(dǎo)致整個(gè)頁(yè)面報(bào)錯(cuò)。
3.需要修改amis整體樣式,或者重復(fù)部分較高,手動(dòng)添加比較耗時(shí),可以新增一個(gè)css文件。可覆蓋之前的樣式,也可以自定義名稱(chēng),添加樣式。
步驟如下:
(1)新增css文件。
(2)將需要修改的css添加到文件中。
(3)將css文件放到項(xiàng)目所在目錄中\(zhòng)apps\bmc\page\bmc-page-config\amis中。
(4)將css文件引入index.html中,并確保不會(huì)被之前的樣式覆蓋。
至此,樣式就可滿足開(kāi)發(fā)需求。

浙公網(wǎng)安備 33010602011771號(hào)