add Poptip component

add Poptip component
This commit is contained in:
梁灏 2016-10-27 10:30:32 +08:00
parent 4dfacfca66
commit 9699c270dc
14 changed files with 420 additions and 120 deletions

View file

@ -9,31 +9,31 @@
</style>
<template>
<div class="tooltip_out">
123
</div>
<div class="tooltip_out">
<Tooltip content="Tooltip 文字提示" placement="top">
<strong><a href="#">Link</a></strong>
<!--<Poptip title="标题" content="内容">-->
<!--<Button>click 触发</Button>-->
<!--</Poptip>-->
<!--<Poptip title="标题" content="内容" trigger="hover">-->
<!--<Button>hover 触发</Button>-->
<!--</Poptip>-->
<Poptip title="确定删除这条信息吗?" content="内容" trigger="focus" @on-ok="ok" @on-cancel="cancel" ok-text="yes" cancel-text="no" width="200">
<a>Delete</a>
</Poptip>
<Poptip title="标题" content="内容" trigger="focus">
<input type="text">
</Poptip>
<!--<Poptip title="标题" content="内容" trigger="focus">-->
<!--<Button>focus 触发</Button>-->
<!--</Poptip>-->
<Tooltip content="这里是提示文字">
当鼠标经过这段文字时会显示一个气泡框
</Tooltip>
</div>
<Row>
<i-col span="12">
<Tooltip content="Top Left 提示文字" placement="top-start">
<Button>上面的左面</Button>
</Tooltip>
</i-col>
<i-col span="12">
<Tooltip content="Top Left 提示文字" placement="top-start">
<Button>上面的左面</Button>
</Tooltip>
</i-col>
</Row>
</template>
<script>
import { Tooltip, Button, Row, iCol } from 'iview';
import { Tooltip, Button, Row, iCol, Poptip, iSelect, iOption, Message } from 'iview';
export default {
components: { Tooltip, Button, Row, iCol },
components: { Tooltip, Button, Row, iCol, Poptip, iSelect, iOption, Message },
props: {
},
@ -46,7 +46,12 @@
},
methods: {
ok () {
Message.info('ok');
},
cancel () {
Message.info('cancel');
}
}
}
</script>