我在回调函数中传递参数时遇到问题。我使用的是redux-form，当我更改select in时SkinList，它会触发onChange回调activeSkinChange方法
在中activeSkinChange，handlSkinChange来自SkinList handlSkinChange属性的调用。我需要将选择值传递给handlSkinChange（event.target.value）
export default class SkinList extends Component {
activeSkinChange = (event) => {
this.props.handlSkinChange(event.target.value);
}
render() {
const { skinList, activeSkin } = this.props;
return (
<div>
<select className="form-control" onChange={this.activeSkinChange} value={activeSkin}>
{this.renderOptions(skinList)}
</select>
</div>
);
}
}
然后移到SkinList之外：
export default class Control extends Component {
onHandlSkinChange = (?, ?) => {
};
render() {
return (
<Field
name="skin.colors.activeSkin"
component={activeSkin =>
<SkinList skinList={skinList} activeSkin={activeSkin} handlSkinChange={this.onHandlSkinChange(activeSkin)}/>
}/>
);
}
}
handlSkinChange将触发回调this.onHandlSkinChange，我还需要通过其他参数activeSkin在this.onHandlSkinChange()上SkinList道具，但它会遇到错误..
这意味着onHandlSkinChange方法中需要传递两个参数，一个是选择值（event.target.value），另一个是activeSkin在连续回调函数期间，如何让我在回调函数中传递参数？任何的想法？
export default class SkinList extends Component {
activeSkinChange (event){
this.props.handlSkinChange(event.target.value);
}
render() {
const { skinList, activeSkin } = this.props;
return (
<div>
<select className="form-control" onChange={this.activeSkinChange.bind(this)} value={activeSkin}>
{this.renderOptions(skinList)}
</select>
</div>
);
}
}
export default class Control extends Component {
onHandlSkinChange (value, activeSkin ) {
console.log("CHECK",value,activeSkin);
}
render() {
return (
<Field
name="skin.colors.activeSkin"
component={activeSkin => <SkinList skinList={skinList} activeSkin={activeSkin}
handlSkinChange={v=>this.onHandlSkinChange(v,activeSkin)}/>
}/>
);
}
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句