antd-mobile中页面更新导致picker自动刷新的问题

  1. 由于界面自动刷新,尤其是开了延时后刷新频繁,会导致picker打开后选中的条目自动回到当前value上,此时需禁止自动更新。
  2. 如下,在打开picker时,通过onVisibleChange (列改变回调)设置一个临时的tempPickerVal,界面显示期间一直用这个值,点击确定时调用onChange再设置当前pickerVal。
state = {
    isPickerShow: false,
    tempPickerVal: ''
}
onVisibleChange = (pickerVal,v) => {
    this.setState({
        tempPickerVal:pickerVal,
        isPickerShow: v,
    });
}
onPickerChange = (v) => {
    this.setState({
        tempPickerVal:v[0]
    });
}

//render -> return
<Picker onVisibleChange={this.onVisibleChange.bind(this,pickerVal)}
        ……
        value={[isPickerShow ? tempPickerVal : pickerVal]}
        onChange={this.changePicker}
        onPickerChange={this.onPickerChange}>
    <List.Item id="picker"/>
</Picker>}

注意:onPickerChange方法的参数是个数组而不是数值,所以不能直接放入value!


版权声明:本文为daoke_li原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。