#

whycq

2022-10-26 4b50f602850763d852deaeaa53b3347c9df53d14

 components/y-pop/y-pop.vue

@@ -1,14 +1,14 @@
<template>
   <view class="canvas">
   <view class="canvas flex-center" v-show="show">
      <view class="main">
         <view class="titles">
         <view class="titles flex-center">
            {{title}}
         </view>
         <view class="decs">
            <slot></slot>
         <view class="decs flex-center">
            <uni-number-box v-model="num" :max="max" :min="min"></uni-number-box>
         </view>
         <view class="operation">
            {{title}}
         <view class="operation flex-center">
            <button size="mini" @click="confrim">确认</button>
         </view>
      </view>
   </view>
@@ -21,11 +21,50 @@
            type: [String,Number],
            default: 'title'
         },
         // num: {
         //    type: Number,
         //    default: 0
         // },
         max: {
            type: Number,
            default: 100
         },
         min: {
            type: Number,
            default: 0
         },
         show: {
            type: Boolean,
            default: false
         }
      },
      watch: {
         // num(num) {
         //    this.num = num
         // },
         show(show) {
            this.show = show
         }
      },
      data() {
         return {
            num: 0,
         };
      },
      methods: {
         confrim() {
            this.show = false
         },
      }
   }
</script>

<style>
   .flex-center {
      display: flex;
      align-items: center;
      justify-content: center;
   }
   .canvas {
      height: 100vh;
      width: 100%;
@@ -33,9 +72,6 @@
      position: fixed;
      left: 0;
      top: 0;
      display: flex;
      align-items: center;
      justify-content: center;
   }
   .main {
      width: 80%;