引入 Amazing UI
- 完整引入，在 main.js 中写入以下内容：
import Vue from 'vue'
import AmazingUI from 'amazing-ui'
import 'amazing-ui/dist/amazing-ui.css'
import App from './App.vue'
Vue.use(AmazingUI)
new Vue({
el: '#app',
components: { App }
})
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
- 单独引入某个组件
import Vue from 'vue'
import {Button,ControllCount} from 'amazing-ui'
import 'amazing-ui/dist/amazing-ui.css'
import App from './App.vue'
Vue.component(Button.name, Button)
Vue.component(ControllCount.name, ControllCount)
new Vue({
el: '#app',
components: { App }
})
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
使用 Amazing UI 示例
重要说明
本框架支持的Vue v2.5.20前。v2.6.0+ 因修复了nextTick的一些Bug，对个别组件的使用会有影响。特别是datePicker组件,因使用了popover组件，在同一区域作条件切换时（对年月日点击时），会造成闪现的Bug。
后期会对datePicker组件做优化。（已修复）
参考：
安装 使用本框架前，请在 CSS 中开启 border-box
*,*::before,*::after{box-sizing: border-box;}
1