42 lines
844 B
Vue
42 lines
844 B
Vue
<template>
|
|
<view>
|
|
<button class="button" type="primary" @click="toggle('bottom')"><text class="button-text">底部</text></button>
|
|
</view>
|
|
<!-- 弹窗 -->
|
|
<uni-popup ref="popup" background-color="#fff" @change="change">
|
|
<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }"><text
|
|
class="text">popup 内容</text></view>
|
|
</uni-popup>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
|
|
}
|
|
},
|
|
setup() {
|
|
const toggle = (type) => {
|
|
console.log(refs, '调试1')
|
|
this.$refs.popup.open(type)
|
|
}
|
|
},
|
|
methods: {
|
|
toggle(type) {
|
|
this.$refs.popup.open(type)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.popup-content {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 15px;
|
|
height: 50px;
|
|
background-color: #fff;
|
|
}
|
|
</style> |