基于Taro开发小程序笔记--05小程序图片放大组件

最新推荐文章于 2023-02-27 16:50:46 发布

weixin_30585437

最新推荐文章于 2023-02-27 16:50:46 发布

阅读量810

点赞数

文章标签： ui

原文链接：http://www.cnblogs.com/zjlx/p/10287456.html

版权

本文介绍了在Taro框架下开发小程序时，如何创建一个用于文字图片放大的组件，适用于展示细节时需要手动放大的场景。详细讲解了组件的JavaScript实现及使用方法。

摘要由CSDN通过智能技术生成

应用场景：当图片文字太小，需要触摸手动放大显示。

组件js

import Taro from '@tarojs/taro'
import {Image} from '@tarojs/components'
export default class ScaleImage extends Taro.Component {
  constructor() {
    super(...arguments)
    this.state = {
      offsetX: 0,
      offsetY: 0,
      zoom: false,
      distance: 0,
      scale: 1
    }
    this.startX = 0;
    this.startY = 0;
  }

  render() {
    let {scale} = this.state;
    let {imageSrc} = this.props;
    return (
      <Image
        src=