Receive a parameter between screens React-Native

I have send a parameter to a screen like that:

var states = [
  {label: "happy", value: 1},
  {label: "sad", value: 2},
  {label: "angry", value: 3},
  {label: "relaxed", value: 4}
];

export default class App extends Component<Props> {
  state = { val: "8" }; // set state here
  render() {
    return (
      <View style={styles.container}>
          <Paragraph style={styles.textStyle}>How are you feeling today ?</Paragraph>
        <RadioForm
          radio_props={states}
          initial={2}
          onPress={(value) => {ToastAndroid.show(value.toString(), ToastAndroid.SHORT),this.setState({val:value})}}
          buttonSize={30}
          buttonOuterSize={40}
          selectedButtonColor={'blue'}
          selectedLabelColor={'blue'}
          labelStyle={{ fontSize: 15, }}
          disabled={false}
          formHorizontal={false}
          />
       
        <Button title="Submit" onPress={() => this.props.navigation.navigate('ButtonsScreen',{
              value: this.state.val})}/>

      </View>
    );
  }
}

and now I try to receive it:

const Buttons = ({navigation}) => {

let param = this.props.navigation.getParam(value)

return (
  
  <View>
<Button title="Run Playlist" onPress={() => navigation.navigate('Playlist')}/>

</View>
);

};

But it gives me an error: "undefined is not an object (evaluating '_this.props.navigation')" Anyone has any idea what is wrong ?

Try like this

const Buttons = ({navigation, route}) => {

let param = route.params.value
....