autoHeight.vue 高度自适應
export default {
data () {
return {
allHeightData: 0,
styleHeight: ''
}
},
props: {
value: {
type: Number,
default: 0
},
noStyle: {
type: Boolean,
default: false
},
allHeight: {
type: Number,
default: 0
},
precent: {
type: Number,
default: 100
},
diffHeight: {
type: Number,
default: 0
}
},
components: {},
computed: {},
mounted () {
this.calcHeight()
window.addEventListener('resize', () => {
this.calcHeight()
})
// window.innerHeight
},
watch: {
'allHeight' (to, from) {
this.calcHeight()
},
'$route' (to, from) {
this.calcHeight()
}
},
methods: {
calcHeight () {
let retHeight
if (this.allHeight === 0) {
this.allHeightData = window.innerHeight
} else {
this.allHeightData = this.allHeight
}
retHeight = (this.allHeightData * this.precent / 100) - this.diffHeight
this.$emit('input', retHeight)
if (!this.noStyle) {
this.styleHeight = 'height: ' + retHeight + 'px; overflow-y:auto;'
}
}
}
}