Skip to content

弹窗

提示弹窗

效果

友情提示
具体的提示内容
好的

代码

vue
<template>
  <!-- 弹窗提示 -->
  <uni-popup ref="popup" type="center">
    <view class="bg-white w-300 flex col ai-c ptb-20 br-12">
      <view class="fs-16 fw-700">友情提示</view>
      <view class="c-6 p-16">具体的提示内容</view>
      <view class="c-white br-20 bg-main flex ai-c jc-c w-268 h-40 fs-16">
        好的
      </view>
    </view>
  </uni-popup>
</template>

<script setup lang="ts">
// 弹窗提示
const popup = ref();
function prestoreClick() {
  popup.value.open("center");
}
function popupClose() {
  popup.value.close();
}
</script>

<style lang="scss" scoped></style>
<template>
  <!-- 弹窗提示 -->
  <uni-popup ref="popup" type="center">
    <view class="bg-white w-300 flex col ai-c ptb-20 br-12">
      <view class="fs-16 fw-700">友情提示</view>
      <view class="c-6 p-16">具体的提示内容</view>
      <view class="c-white br-20 bg-main flex ai-c jc-c w-268 h-40 fs-16">
        好的
      </view>
    </view>
  </uni-popup>
</template>

<script setup lang="ts">
// 弹窗提示
const popup = ref();
function prestoreClick() {
  popup.value.open("center");
}
function popupClose() {
  popup.value.close();
}
</script>

<style lang="scss" scoped></style>