jd-opensource / jd-opensource/taro-ui
Taro-UI 3.0.0-alpha.3 AtImagePicker删除图片触发选择图片功能
- Dominant language
- TypeScript
- Stars
- 4.7k
- Forks
- 740
- PR merge metrics
- No merged PRs in 30d
Description
**问题描述**
Taro-UI 3.0.0-alpha.3 AtImagePicker删除图片触发选择图片功能
**复现步骤**
```js
import React, { useEffect, useRef, useState } from 'react'
import { Canvas, View } from '@tarojs/components'
import { AtImagePicker } from 'taro-ui'
import { setGlobal } from '@config/global'
import PropTypes from 'prop-types'
import { scaleImgArr, showImg } from './util'
function UpLoadImage({ sty, files, showAddBtn, count, length, label, required, error, tip, onChange, children }) {
const isSingle = count === 1
const imgs = useRef([])
const viewEl = useRef(null)
const [items, setItems] = useState([])
useEffect(() => {
setGlobal('userHideope', 'chooseImage')
if (!files) {
onChange(isSingle ? '' : [])
return
}
const url = []
const arr = []
files.forEach(item => {
if (item) {
url.push(item.url || item)
arr.push(item.url ? item : { url: item })
}
})
imgs.current = url
setItems(arr)
onChange(isSingle ? arr[0] || '' : arr)
}, [files])
return (
{label &&
{label}
}
{children}
{
setGlobal('userHideope', 'chooseImage')
console.log(111, ope, items, index)
if (ope === 'remove') {
items.splice(index, 1)
setItems([...items])
return false
}
console.log(222)
if (!imgFiles.length) {
setItems([])
onChange(isSingle ? '' : [])
return
}
const arr = isSingle ? [imgFiles[imgFiles.length - 1]] : imgFiles.slice(0, count)
setItems(arr)
scaleImgArr(viewEl, arr, 0, (imgArr) => {
imgs.current = imgArr
onChange(isSingle ? arr[0] : arr)
})
}}
onImageClick={index => showImg(index, imgs.current)}
/>
{tip &&
{tip}
}
{error &&
}
)
}
UpLoadImage.propTypes = {
sty: PropTypes.string,
files: PropTypes.array,
showAddBtn: PropTypes.bool,
count: PropTypes.number,
length: PropTypes.number,
label: PropTypes.string,
required: PropTypes.bool,
error: PropTypes.bool,
tip: PropTypes.string,
onChange: PropTypes.func,
children: PropTypes.object
}
UpLoadImage.defaultProps = {
sty: 'at-input',
files: [],
showAddBtn: true,
count: 10,
length: 4,
onChange: () => {
}
}
UpLoadImage.options = {
addGlobalClass: true
}
export default UpLoadImage
```
**期望行为**
删除的时候不要触发图片选择
**报错信息**
**系统信息**
Taro v3.0.7
Taro UI v3.0.0-alpha.3
平台 weapp
**补充信息**
Contributor guide
Research direction
Start by reproducing the supplied UpLoadImage example with AtImagePicker on the weapp platform using Taro v3.0.7 and Taro UI v3.0.0-alpha.3. Trace the AtImagePicker onChange path when an image is removed and verify that deletion no longer opens image selection while adding an image still does.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100