Browse Source

merge

pull/9/head
wangxueliang 7 years ago
parent
commit
d6a8a880c0
  1. 7
      components/trigger/Popup.vue
  2. 16
      components/trigger/Transition.vue
  3. 29
      examples/dialog.vue
  4. 70
      examples/rate.vue

7
components/trigger/Popup.vue

@ -98,7 +98,7 @@ export default {
return `${this.$props.prefixCls} ${this.$props.popupClassName} ${currentAlignClassName}`
},
getPopupElement () {
const { $props: props, $slots, $listeners } = this
const { $props: props, $slots, $listeners, getTransitionName } = this
const { align, visible, prefixCls, animation } = props
const { mouseenter, mouseleave } = $listeners
this.currentAlignClassName = this.currentAlignClassName || props.getClassNameFromAlign(align)
@ -129,6 +129,7 @@ export default {
}),
}
let opacity = '1'
const transitionName = getTransitionName()
const transitionEvent = {
beforeEnter: (el) => {
opacity = el.style.opacity
@ -138,10 +139,10 @@ export default {
},
enter: (el, done) => {
el.style.opacity = opacity
animate(el, 'zoom-big-enter', done)
animate(el, `${transitionName}-enter`, done)
},
leave: (el, done) => {
animate(el, 'zoom-big-leave', done)
animate(el, `${transitionName}-leave`, done)
},
afterLeave: (el) => {
if (this.destroyPopupOnHide) {

16
components/trigger/Transition.vue

@ -1,16 +0,0 @@
<script>
export default {
props: {
transitionProps: Object,
},
render () {
return (
<transition
{...this.transitionProps}
>
{this.$slots.default}
</transition>
)
},
}
</script>

29
examples/dialog.vue

@ -1,29 +0,0 @@
<template>
<div>
<AntButton @click="handleClick">toogle dialog</AntButton>
<AntDialog :visible="visible">
测试{{visible}}
</AntDialog>
</div>
</template>
<script>
import Dialog from '../src/dialog/index'
import Button from '../src/index'
export default {
data () {
return {
visible: true,
show: false,
}
},
methods: {
handleClick (event) {
this.visible = !this.visible
},
},
components: {
AntDialog: Dialog,
AntButton: Button,
},
}
</script>

70
examples/rate.vue

@ -1,70 +0,0 @@
<template>
<div>
基本
<Rate class="custom"></Rate>
</br>
半星
<Rate :allowHalf="allowHalf"></Rate>
</br>
默认3颗星
<Rate v-model="initValue"></Rate>
<AntButton type="primary" @click="changeValue">改变</AntButton>
<AntButton type="primary" @click="getValue">当前值</AntButton>
</br>
只读
<Rate :value="initValue" :disabled="disabled"></Rate>
</br>
回调函数
<Rate
:onChange="onChange"
:onHoverChange="onHoverChange"></Rate>
<span v-if="hoverValue">{{hoverValue}}stars</span>
<span v-if="rValue">{{rValue}}stars</span>
<br/>
<Rate
:allowHalf="allowHalf"
:onHoverChange="onHoverChangeAH"></Rate>
<span v-if="hoverValueAH">{{hoverValueAH}}stars</span>
</br>
自定义
<Rate :value="initValue" :allowHalf="allowHalf" :character="character"></Rate>
</div>
</template>
<script>
import { Rate, Icon, Button } from '../components/index'
export default {
data () {
return {
allowHalf: true,
initValue: 3,
disabled: true,
hoverValue: undefined,
rValue: undefined,
hoverValueAH: undefined,
character: '好',
}
},
methods: {
onHoverChange (val) {
this.hoverValue = val
},
onChange (val) {
this.rValue = val
},
onHoverChangeAH (val) {
this.hoverValueAH = val
},
changeValue () {
this.initValue = undefined
},
getValue () {
console.log(this.initValue)
},
},
components: {
Rate,
Icon,
AntButton: Button,
},
}
</script>
Loading…
Cancel
Save