jarden-digital / react-native-pincode

A PIN code component for react native
MIT License
391 stars 200 forks source link

buttonDeleteComponent not deleting the pincode #174

Open pepemiso16 opened 3 years ago

pepemiso16 commented 3 years ago

I have set up the props buttonDeleteComponent, however, it seems that there's no definition or documentation of how we can be able to delete the pin code every time we click the new component for the delete icon.

buttonDeleteComponent={() => {
          return (
            <TouchableHighlight>
              <View>
                <Icon
                  name={'backspace'}
                />
                <Text>Test Delete</Text>
              </View>
            </TouchableHighlight>
          )
}}
jeremy-farnault commented 3 years ago

Hey,

Yes it's missing sorry. Atm it's doing this:


this.props.buttonDeleteComponent(() => {
  if (this.state.password.length > 0) {
    const newPass = this.state.password.slice(0, -1);
    this.setState({ password: newPass });
    if (this.props.getCurrentLength)
      this.props.getCurrentLength(newPass.length);
    }
})
joaocosta9 commented 3 years ago

@Haskkor sorry, im having this same problem, but I didn't understand what we need to do with that code you put there. Can you explain please?

joaocosta9 commented 3 years ago

Ok I already figured it out, for anyone wondering you just need to pass a variable to your component that will result in the function @Haskkor mentioned, and then call it in your button. Something like this

`buttonDeleteComponent={(eraseCharacter) => ( <TouchableOpacity onPress={() => eraseCharacter()}>

              <Text style={{color: globals.colors.ghost}}>Delete</Text>
            </TouchableOpacity>

)}`

I named it eraseCharacter, but you can name it whatever you want