pyqt 获取 UI 中组件_一起学Vue:UI框架(elementui)
目標(biāo)
使用Vue+ElementUI構(gòu)建一個(gè)非常簡單CRUD應(yīng)用程序,以便您更好地了解它的工作方式。
效果頁面
比如我們要實(shí)現(xiàn)這樣列表、新增、編輯三個(gè)頁面:
列表頁面
新增頁面
編輯頁面
安裝element
我們使用 vue-cli@3 進(jìn)行安裝
vue add element列表組件(TodoListWithUI.vue)
與我們上次講的無UI的列表組件邏輯基本都是一樣的,我們這里主要用到了el-table,el-button這兩個(gè)UI組件,至于UI組件的用法我們這里就不介紹了,大家直接上官網(wǎng)上看示例代碼就好了,我們在這里直接貼代碼:
新增編輯刪除新增組件(TodoAddWithUI.vue)
我們主要用到了el-dialog,el-form,直接貼代碼:
取 消確 定編輯組件(TodoEditWithUI.vue)
我TodoAddWithUI基本上一樣,你也可以把這兩個(gè)合并成一個(gè)組件,我們?yōu)榱诉壿嫺忧宄头珠_了,直接貼代碼:
取 消確 定小結(jié)
目前為止,我們完成了Vue+ElementUI的CRUD,是不是還是挺簡單的呀。其實(shí)你如果用其他的UI框架,操作方式也差不多。
文中用到的代碼我們放在:https://github.com/zcqiand/miscellaneous/tree/master/vue
在這里我推薦一些人氣比較高的UI框架:
1.Vuetify
Star 數(shù)為 11K,提供了 80 多個(gè) Vue.js 組件,這些組件是根據(jù)谷歌 Material Design 指南實(shí)現(xiàn)的。Vuetify 支持所有平臺上的瀏覽器,包括 IE11 和 Safari 9+(使用 polyfill),并提供了 8 個(gè) vue-cli 模板。
地址:https://github.com/vuetifyjs/vuetify
2.Quasar
Star 數(shù)超過 6K,是構(gòu)建 Vue.js 響應(yīng)式網(wǎng)站、PWA、混合移動應(yīng)用和 Electron 應(yīng)用的流行框架。Quasar 還支持諸如 HTML/CSS/JS 壓縮、緩存清除、搖樹優(yōu)化(tree shaking)、源映射、代碼分割和延遲加載、ES6 轉(zhuǎn)碼等功能。
地址:https://github.com/quasarframework/quasar
3. Vux
Star 數(shù)超過 13K,是一個(gè)流行的社區(qū)庫,基于 WeUI 和 Vue 2.0。該庫還支持 webpack+vue-loader+vux 的工作流。它的文檔也是中文的。
地址:https://github.com/airyland/vux
4. iView
Star 數(shù)將近 16K,提供了數(shù)十種用 Vue.js 構(gòu)建的 UI 組件和小部件,并采用了干凈而優(yōu)雅的設(shè)計(jì)。iView 被廣泛采用,社區(qū)也在積極維護(hù),并提供了 CLI 工具用于以可視化的方式創(chuàng)建項(xiàng)目。這個(gè)也值得一試。
地址:https://github.com/iview/iview
5.Mint UI
Star 數(shù)超過 11K,為 Vue.js 提供 UI 元素,提供了用于構(gòu)建移動應(yīng)用程序的 CSS 和 JS 組件。當(dāng)全部導(dǎo)入時(shí),壓縮后的代碼只有月 30KB(JS+CSS),當(dāng)然它也支持單個(gè)組件的導(dǎo)入。
地址:https://github.com/ElemeFE/mint-ui/
6.Ant Design Vue
Star 數(shù)約 1.5K,用于開發(fā)具有數(shù)十個(gè) Ant Design 實(shí)現(xiàn)組件的企業(yè)級后端產(chǎn)品,并支持基于 Webpack 調(diào)試的構(gòu)建解決方案(支持 ES6)。請注意,它的開發(fā)已經(jīng)停止了一段時(shí)間。
地址:https://github.com/okoala/vue-antd
總結(jié)
以上是生活随笔為你收集整理的pyqt 获取 UI 中组件_一起学Vue:UI框架(elementui)的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: github流程图_「强烈推荐」开源的在
- 下一篇: vue 倒序遍历数组_【一天一大 lee