init Avatar component
This commit is contained in:
parent
9823357382
commit
2c5faf30f4
9 changed files with 66 additions and 14 deletions
|
@ -54,6 +54,7 @@ li + li { border-left: solid 1px #bbb; padding-left: 10px; margin-left: 10px; }
|
|||
<li><router-link to="/modal">Modal</router-link></li>
|
||||
<li><router-link to="/message">Message</router-link></li>
|
||||
<li><router-link to="/notice">Notice</router-link></li>
|
||||
<li><router-link to="/avatar">Avatar</router-link></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<router-view></router-view>
|
||||
|
|
|
@ -180,6 +180,10 @@ const router = new VueRouter({
|
|||
{
|
||||
path: '/notice',
|
||||
component: require('./routers/notice.vue')
|
||||
},
|
||||
{
|
||||
path: '/avatar',
|
||||
component: require('./routers/avatar.vue')
|
||||
}
|
||||
]
|
||||
});
|
||||
|
|
8
examples/routers/avatar.vue
Normal file
8
examples/routers/avatar.vue
Normal file
|
@ -0,0 +1,8 @@
|
|||
<template>
|
||||
<Avatar></Avatar>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
|
||||
}
|
||||
</script>
|
|
@ -1,21 +1,24 @@
|
|||
<template>
|
||||
<div>
|
||||
<Poptip trigger="hover" title="提示标题" content="提示内容">
|
||||
<Button>hover 激活</Button>
|
||||
</Poptip>
|
||||
<Poptip transfer title="提示标题" content="提示内容">
|
||||
<Button>click 激活</Button>
|
||||
</Poptip>
|
||||
<Poptip trigger="focus" title="提示标题" content="提示内容">
|
||||
<Button>focus 激活</Button>
|
||||
</Poptip>
|
||||
<Poptip trigger="focus" title="提示标题" content="提示内容">
|
||||
<i-input placeholder="输入框的 focus"></i-input>
|
||||
<div style="margin: 100px;">
|
||||
<Poptip
|
||||
confirm
|
||||
transfer
|
||||
title="您确认删除这条内容吗?"
|
||||
@on-ok="ok"
|
||||
@on-cancel="cancel">
|
||||
<Button>删除</Button>
|
||||
</Poptip>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
|
||||
methods: {
|
||||
ok () {
|
||||
this.$Message.info('点击了确定');
|
||||
},
|
||||
cancel () {
|
||||
this.$Message.info('点击了取消');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
26
src/components/avatar/avatar.vue
Normal file
26
src/components/avatar/avatar.vue
Normal file
|
@ -0,0 +1,26 @@
|
|||
<template>
|
||||
<span>
|
||||
|
||||
</span>
|
||||
</template>
|
||||
<script>
|
||||
const prefixCls = 'ivu-avatar';
|
||||
|
||||
export default {
|
||||
name: 'Avatar',
|
||||
props: {
|
||||
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
2
src/components/avatar/index.js
Normal file
2
src/components/avatar/index.js
Normal file
|
@ -0,0 +1,2 @@
|
|||
import Avatar from './avatar.vue';
|
||||
export default Avatar;
|
|
@ -3,6 +3,7 @@ import 'core-js/fn/array/find-index';
|
|||
|
||||
import Affix from './components/affix';
|
||||
import Alert from './components/alert';
|
||||
import Avatar from './components/avatar';
|
||||
import BackTop from './components/back-top';
|
||||
import Badge from './components/badge';
|
||||
import Breadcrumb from './components/breadcrumb';
|
||||
|
@ -49,6 +50,7 @@ import locale from './locale';
|
|||
const iview = {
|
||||
Affix,
|
||||
Alert,
|
||||
Avatar,
|
||||
BackTop,
|
||||
Badge,
|
||||
Breadcrumb,
|
||||
|
|
5
src/styles/components/avatar.less
Normal file
5
src/styles/components/avatar.less
Normal file
|
@ -0,0 +1,5 @@
|
|||
@avatar-prefix-cls: ~"@{css-prefix}avatar";
|
||||
|
||||
.@{avatar-prefix-cls} {
|
||||
|
||||
}
|
|
@ -39,3 +39,4 @@
|
|||
@import "rate";
|
||||
@import "upload";
|
||||
@import "tree";
|
||||
@import "avatar";
|
Loading…
Add table
Reference in a new issue