您好,登錄后才能下訂單哦!
小編給大家分享一下vue中iView指的是什么,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
在vue中,iView是一套基于Vue.js的開源UI組件庫,主要服務于PC界面的中后臺產品。iView提供豐富的組件和功能,可滿足絕大部分網站場景;提供開箱即用的Admin系統和高階組件庫,極大程度節省開發成本。
iView 是一套基于 Vue.js 的開源 UI 組件庫,主要服務于 PC 界面的中后臺產品。使用單文件的 Vue 組件化開發模式,基于 npm + webpack + babel 開發,支持 ES2015 高質量、功能豐富 友好的 API ,自由靈活地使用空間,由TalkingData開發維護,有很多知名互聯網企業都在使用。
官網地址:https://www.iviewui.com/
iView的特性
豐富的組件和功能,滿足絕大部分網站場景
提供開箱即用的 Admin 系統 和 高階組件庫,極大程度節省開發成本
提供專業、優質的一對一技術支持
友好的 API ,自由靈活地使用空間
細致、漂亮的 UI
事無巨細的文檔
可自定義主題
iView的安裝:
1) 使用npm:
npm install --save iview
2) CDN引入:
<link rel="stylesheet" href="css/iview.css"> <script src="js/iview.min.js"></script>
引入 iView
1) 一般在 webpack 入口頁面 main.js 中如下配置:
import Vue from 'vue'; import VueRouter from 'vue-router'; import App from 'components/app.vue'; // 路由掛載 import Routers from './router.js'; // 路由列表 import iView from 'iview'; // 導入組件庫 import 'iview/dist/styles/iview.css'; // 導入樣式 Vue.use(VueRouter); Vue.use(iView); // 路由配置 const RouterConfig = { routes: Routers }; const router = new VueRouter(RouterConfig); new Vue({ el: '#app', router: router, render: h => h(App) });
2) 按需引用
在webpack中按需使用組件,可以減少文件體積:
import Input from 'iview/src/components/input';
注意:
① 按需引用仍需要導入樣式,即在 main.js 或根組件執行 import 'iview/dist/styles/iview.css';
② 按需引用是直接引用的組件庫源代碼,需要借助 babel 進行編譯,以 webpack 為例:
module: { rules: [ { test: /iview.src.*?js$/, loader: 'babel' }, { test: /\.js$/, loader: 'babel', exclude: /node_modules/ } ] }
組件使用規范
使用:prop傳遞數據格式為數字、布爾值或函數時,必須帶:(即,使用v-bind),它的值會被當做JavaScript表達式計算,否則會被當做字符串。
正確的使用方法:
<Page :current="1" :total="10"></Page>
錯誤的使用方法:
<Page current="1" total="10"></Page>
以上是“vue中iView指的是什么”這篇文章的所有內容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內容對大家有所幫助,如果還想學習更多知識,歡迎關注億速云行業資訊頻道!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。