jd-opensource / jd-opensource/taro-ui
Taro AtInput在循环时通过onChange事件传入下标,获取到的是最后一个
- Dominant language
- TypeScript
- Stars
- 4.7k
- Forks
- 740
- PR merge metrics
- No merged PRs in 30d
Description
### Taro UI 版本信息
3.0.0-alpha.3
### 问题描述
使用TaroUI AtInput在数组map时,将传入的第二个参数下标放到onChange事件中,打印的会是数组的长度。
### 复现步骤
1. 遍历数组,循环写入AtInput
2. 添加点击事件并将下标传入onChange事件中
3. 观察打印
### 复现代码
```javascript
import React, { Component } from "react";
import { View } from "@tarojs/components";
import { AtForm, AtButton, AtInput } from "taro-ui";
import "taro-ui/dist/style/components/input.scss";
import "taro-ui/dist/style/components/button.scss";
class Index extends Component {
state = {
userList: [{ key: 1 }]
};
handleChange(index, val, e) {
console.log(index, val, e);
return val;
}
onAddNewRow() {
const { userList = [] } = this.state;
const newUserList = userList.concat({
key: ~~(Math.random() * 100000),
name: ""
});
this.setState({
userList: newUserList
});
}
render() {
const { userList = [] } = this.state;
return (
添加
{userList.map((it, index) => (
))}
);
}
}
export default Index;
```
### 报错信息
无报错信息
### 系统信息
```
Taro CLI 3.0.18 environment info:
System:
OS: macOS 10.15.6
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 12.18.3 - ~/.nvm/versions/node/v12.18.3/bin/node
Yarn: 1.22.4 - ~/.nvm/versions/node/v12.18.3/bin/yarn
npm: 6.14.6 - ~/.nvm/versions/node/v12.18.3/bin/npm
npmPackages:
@tarojs/cli: 3.0.18 => 3.0.18
@tarojs/components: 3.0.18 => 3.0.18
@tarojs/mini-runner: 3.0.18 => 3.0.18
@tarojs/react: 3.0.18 => 3.0.18
@tarojs/runtime: 3.0.18 => 3.0.18
@tarojs/taro: 3.0.18 => 3.0.18
@tarojs/webpack-runner: 3.0.18 => 3.0.18
babel-preset-taro: 3.0.18 => 3.0.18
eslint-config-taro: 3.0.18 => 3.0.18
react: ^16.10.0 => 16.14.0
taro-ui: ^3.0.0-alpha.3 => 3.0.0-alpha.10
```
### 补充信息
因为出现的打印一直为数组长度,可能考虑到循环中的闭包问题,希望能有帮助。
Contributor guide
Assessment
This issue has not been assessed yet.