<template>
  <view class="page">
    <view :style="{ backgroundColor: CommonEnum.BASE_COLOR }" class="header">
      <uv-qrcode
        ref="qrcode"
        :options="options"
        :value="value"
        canvas-id="qrcode"
        size="300rpx"
      ></uv-qrcode>
    </view>
  </view>
</template>

<script>
import UvQrcode from "../../uni_modules/uv-qrcode/components/uv-qrcode/uv-qrcode.vue";

export default {
  components: { UvQrcode },
  data() {
    return {
      value: "sb",
      options: {
        useDynamicSize: false,
        errorCorrectLevel: "Q",
        margin: 10,
        areaColor: "#fff",

        // 指定二维码前景，一般可在中间放logo
      },
    };
  },
  onLoad() {
    // 页面加载时获取数据

    this.$nextTick(() => {
      this.$refs.qrcode.remake({
        success: () => {
          console.log("生成成功");
        },
        fail: (err) => {
          console.log(err);
        },
      });
    });
  },
  methods: {
    // 加载页面数据
  },
};
</script>

<style lang="scss" scoped>
.page {
  background: #f5f0e7;
}

.header {
  width: 100%;
  //min-height: 100vh;//可能导致页面留白
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  padding: 200rpx 200rpx;
  padding-bottom: 40rpx;
}
</style>
