Resizing a canvas in RN and drawing on the new canvas

rn-resize-canvas.js

import React, {Component} from 'react';
import {View, StyleSheet, Button} from 'react-native';
import Canvas, {Path2D} from 'react-native-canvas';

export default class App extends Component {
  handlePath = (canvas) => {
    if (!canvas) {
      return;
    }

    canvas.width = 100;
    canvas.height = 150;
    const context = canvas.getContext('2d');

    context.fillStyle = 'red';
    context.fillRect(0, 0, 500, 500);

    this.setState({
      canvas
    });

    console.log(canvas)
  }

  resize = (args) => {
    const { canvas } = this.state;

    canvas.width = 300;
    canvas.height = 400;

    const context = canvas.getContext('2d');

    context.fillStyle = 'red';
    context.fillRect(0, 0, 500, 500);

    console.log(canvas)

    this.setState({
      canvas
    })
  }

  render() {
    return (
      <View style={styles.container}>
        <Canvas ref={this.handlePath} style={styles.canvas}  />
        <Button title="resize" onPress={this.resize} />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    position: 'absolute',
    top: 0,
    left: 0,
    width: '100%',
    height: '100%',

    borderWidth: 3,
    borderColor: 'green'
  },
  canvas: {
    borderWidth: 3,
    borderColor: 'red',
    width: 500,
    height: 500
  }
});