当前位置: 首页 > news >正文

微信小程序如何实现点击上传图片功能

如下所示,实际需求中常常存在需要点击上传图片的功能,上传前显示边框表面图片显示大小,上传后将图形缩放到边框大小。

实现如下:

.wxml

<view class="{{img_src==''?'blank-area':''}}" style="width:100%;height:40%;display:flex;align-items: center;justify-content:center;" data-info='{"page_index":{{index}},"product_index":"first"}' bind:tap="upload_product_image"><image wx:if="{{img_src!=''}}" src="{{img_src}}" style="width:100%;height:100%;"/><label wx:if="{{img_src==''}}">上传产品图片</label>
</view>

.wxss

.blank-area{border-style: dashed;
http://www.lryc.cn/news/290864.html

相关文章:

  • Windows Qt C++ VTK 绘制三维曲线
  • Android T 远程动画显示流程(更新中)
  • 【计算机网络】【练习题及解答】【新加坡南洋理工大学】【Computer Control Network】
  • 云计算HCIE备考经验分享
  • Threejs API——`OrbitControls`相机控件
  • 远程教育:低代码在教育技术领域的重塑之力
  • vue 模板语法值class操作
  • MySQL的原生API实现插入数据后在可视化工具上不显示的问题解决
  • Blender教程(基础)-内插面、分离、环切、倒角-08
  • Unity 自动轮播、滑动轮播
  • 纯html+js+css个人博客
  • 二百二十一、HiveSQL报错:return code 2 from org.apache.hadoop.hive.ql.exec.mr.MapRedTask
  • JavaEE学习笔记 2024-1-25 --VUE的入门使用
  • php-fpm详细讲解
  • 小白水平理解面试经典题目LeetCode 455 Assign Cookies【Java实现】
  • uniapp 问题汇总-问题数(2)
  • [AG32VF407]国产MCU+FPGA Verilog编写控制2路gpio输出不同频率方波实验
  • python coding with ChatGPT 打卡第15天| 二叉树:翻转二叉树、对称二叉树
  • Python(19)Excel表格操作Ⅰ
  • HiveSQL题——聚合函数(sum/count/max/min/avg)
  • 计算机是什么做的
  • C++多线程1(复习向笔记)
  • 代理IP在游戏中的作用有哪些?
  • SVN Previous operation has not finished; run ‘cleanup‘ if it was interrupted
  • MATLAB知识点:MATLAB的文件管理
  • 【深度学习】MNN ImageProcess处理图像顺序,逻辑,均值,方差
  • 代码随想录算法训练营29期Day35|LeetCode 860,406,452
  • 20240130金融读报1分钟小得01
  • 刷力扣题过程中发现的不熟的函数
  • native2ascii命令详解