uniapp 需要在预览图片时显示字

如果你想在预览图片时显示文字，可以使用uni-app的`uni.previewImage()`方法和自定义组件来实现。具体步骤如下：

1. 使用`uni.previewImage()`方法预览图片，该方法支持传入一个对象作为参数，对象中可以包含`urls`、`current`等属性。

2. 创建一个自定义组件，在组件中添加一个文字元素，用于显示你想要展示的文字。

3. 在`uni.previewImage()`方法的回调函数中，动态创建并显示自定义组件，将文字内容传递给组件的属性，使文字显示在预览图片上方。

4. 当用户关闭预览图片时，销毁自定义组件。

以下是一个示例代码，仅供参考：

<template>
  <view>
    <image :src="imageUrl" mode="aspectFit" @click="previewImage"></image>
    <custom-text :content="text" v-if="showText"></custom-text>
  </view>
</template>

<script>
  import CustomText from '@/components/CustomText'

  export default {
    components: {
      CustomText
    },
    data() {
      return {
        imageUrl: 'https://example.com/image.jpg',
        text: '这是预览图片时要显示的文字',
        showText: false
      }
    },
    methods: {
      previewImage() {
        uni.previewImage({
          urls: [this.imageUrl],
          current: 0,
          success: () => {
            this.showText = true
            uni.createSelectorQuery()
              .select('.custom-text')
              .boundingClientRect(rect => {
                this.textTop = rect.top
              })
              .exec()
          },
          fail: () => {
            this.showText = false
          },
          complete: () => {
            this.showText = false
            uni.remove('.custom-text')
          }
        })
      }
    }
  }
</script>

在上面的代码中，我们创建了一个包含预览图片和自定义组件的视图。当用户点击图片时，调用`previewImage()`方法预览图片，并在成功回调中显示自定义组件。自定义组件使用了`content`属性来接收要显示的文字内容。在预览图片时，使用`uni.createSelectorQuery()`方法获取组件的位置信息，动态设置文字的位置，使其显示在图片上方。最后，在完成回调中销毁自定义组件。