How to update multiple state values ​​using one function?

Question

JavaScript

Good afternoon ! I have a state like this:

state = {
    photos : {
      driverPhoto : null,
      passportPhoto : null,
      driverLicensePhoto: null,
    },
  };

There is a function that calls camera roll and sets the selected image to the state.

useLibraryHandler = async () => {
    await this.askPermissionsAsync();
    let result = await ImagePicker.launchImageLibraryAsync({
      allowsEditing: true,
      aspect: [4, 3]
    });
    this.setState({ photos : { ...this.state.photos, driverPhoto : result.uri } });
  };

Here is the element that calls the function:

<TouchableHighlight onPress={this.useLibraryHandler}></TouchableHighlight>

Can you please tell me how to rewrite the function so that it can be called for example like this?
So that the function can be used in different places and update different state elements.

<TouchableHighlight onPress={this.useLibraryHandler('driverPhoto')}></TouchableHighlight>

Answer 1

So pass the name of a specific element as a separate prop:

<TouchableHighlight onPress={this.useLibraryHandler} photoType="driverPhoto" />

No closures will be needed, just read the passed string.

let newPhotos = {...this.state.photos};
newPhotos[this.props.photoType] = result.uri;
this.setState({ photos : newPhotos });