chooseBgImg.vue 1.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445
  1. <template>
  2. <view>
  3. <u-cell-group>
  4. <u-cell-item title="选择内置背景图" :title-style="{ marginLeft: '10rpx' }" @click="linkToBuiltinBgImg"></u-cell-item>
  5. </u-cell-group>
  6. <view style="height: 10rpx;"></view>
  7. <u-cell-group>
  8. <u-cell-item title="通过手机选择" :title-style="{ marginLeft: '10rpx' }" @click="chooseImg"></u-cell-item>
  9. </u-cell-group>
  10. <u-toast ref="uToast" />
  11. </view>
  12. </template>
  13. <script>
  14. export default {
  15. data() {
  16. return {};
  17. },
  18. methods: {
  19. chooseImg() {
  20. this.$u.route({
  21. url: 'components/u-avatar-cropper/u-avatar-cropper',
  22. params: {
  23. destWidth: uni.upx2px(750),
  24. rectWidth: uni.upx2px(500),
  25. fileType: 'jpg'
  26. }
  27. });
  28. },
  29. linkToBuiltinBgImg() {
  30. this.$u.route('pages/builtinBgImg/builtinBgImg');
  31. },
  32. emitVuex(path) {
  33. this.$u.route({ type: 'back' });
  34. uni.$off('uAvatarCropper', this.emitVuex);
  35. }
  36. },
  37. created() {
  38. // 监听从裁剪页发布的事件,获得裁剪结果
  39. uni.$on('uAvatarCropper', this.emitVuex);
  40. }
  41. };
  42. </script>
  43. <style></style>