LWC – Reset button for the component

buttonlightning-web-components

Hey I have a LWC and want to put a reset button where it can reset everything in the component(such as uploaded files and etc.)

Currently have a retakePhoto function but it seems like it's not working properly. But I don't want it to use such function as "window.location.reload(true);" where it resets the whole window. Any idea?

This is Demo:
https://webcomponents.dev/edit/spOqm9nMonL1DtibANXA

.html

<template>
    <button onclick={startCamera}>Start Camera</button>
    <video width="320" height="240" autoplay></video>
    <button onclick={clickPhoto}>Click Photo</button>
    <canvas width="320" height="240"></canvas>
</template>

.js

  retakePhoto(event) {
    eval("$A.get('e.force:refreshView').fire();");
  }

Best Answer

This will work - Resets the canvas

  retakePhoto(event) {
    var canvas = this.template.querySelector('canvas');
    var context = canvas.getContext('2d');
    context.clearRect(0, 0, canvas.width, canvas.height); //clear html5 canvas
  }
Related Topic