微信小程序开发交流qq群 173683895
承接微信小程序开发。扫码加微信。
1.传数组下标给点击事件Demo：
const A = 65 // ASCII character codeclass Alphabet extends ponent {constructor(props) {super(props);this.handleClick = this.handleClick.bind(this);this.state = {justClicked: null,letters: Array.from({length: 26}, (_, i) => String.fromCharCode(A + i))};}handleClick(letter) {this.setState({ justClicked: letter });}render() {return (<div>Just clicked: {this.state.justClicked}<ul>{this.state.letters.map(letter =><li key={letter} onClick={() => this.handleClick(letter)}>{letter}</li>)}</ul></div>)}}
代码说明，定义了一个数组，名为字母，在组件里面通过对循环渲染，每个渲染出来的李组件都绑定了对应的按键和点击事件，并且把该组件的关键当做参数传递给了handleClick函数。
2.传递自定义属性给事件Demo
const A = 65 // ASCII character codeclass Alphabet extends ponent {constructor(props) {super(props);this.handleClick = this.handleClick.bind(this);this.state = {justClicked: null,letters: Array.from({length: 26}, (_, i) => String.fromCharCode(A + i))};}handleClick(e) {this.setState({justClicked: e.target.dataset.letter});}render() {return (<div>Just clicked: {this.state.justClicked}<ul>{this.state.letters.map(letter =><li key={letter} data-letter={letter} onClick={this.handleClick}>{letter}</li>)}</ul></div>)}}
定义了自定义属性 letter 值是数组letters的下标。然后在 handleClick 事件通过 e.target.dataset 获取。
