- run by vite

- change camera

src/views/SampleCamera.vue

@@ -0,0 +1,42 @@
+<script setup lang="ts">
+import Camera from 'simple-vue-camera'
+import { ref } from 'vue'
+
+const camera = ref<InstanceType<typeof Camera>>();
+
+const cameraIsOn = ref<boolean>(false)
+
+const cameraOff = () => {
+  cameraIsOn.value ? camera.value?.stop() : camera.value?.start()
+  cameraIsOn.value = !cameraIsOn.value
+}
+
+// Use camera reference to call functions
+const takePicture = async () => {
+  const imageBlob = await camera.value?.snapshot(
+    { width: 640, height: 480 },
+    'image/png',
+    0.5
+  )
+
+  console.log('imageBlob', imageBlob)
+  camera.value?.stop()
+}
+</script>
+
+<template>
+  <div class="row col-12">
+    <div class="col-3">
+      <Camera
+        :resolution="{ width: 500, height: 500 }"
+        ref="camera"
+        :autoplay="false"
+      >
+        <q-btn color="primary" @click="cameraOff"
+          >I'm on top of the video</q-btn
+        >
+        <q-btn color="primary" @click="takePicture">Take Picture</q-btn>
+      </Camera>
+    </div>
+  </div>
+</template>