Next.js Discord

Discord Forum

NPM Barcode scanner package instructions unclear :(

Unanswered
West African Lion posted this in #help-forum
Open in Discord
West African LionOP
I'm trying to use the following package:
https://www.npmjs.com/package/@use-symbology-scanner/react#usage

I created this simple page (this is all the code there is), but I don't have the camera or anything that would allow me to scan the barcode. Any suggestions on what I might be missing?

"use client";
import { useSymbologyScanner } from "@use-symbology-scanner/react";
import { useRef, useState } from "react";

export default function Home() {
  const ref = useRef(null);
  const [barcode, setBarcode] = useState(null);

  const handleSymbol = (symbol, matchedSymbologies) => {
    console.log(`Scanned ${symbol}`);
    setBarcode(symbol);
  };

  useSymbologyScanner(handleSymbol, { target: ref });

  return (
    <main className="flex min-h-screen flex-col items-center justify-between p-24">
      Hello World!
      <div ref={ref}>
        Barcode?
        {barcode}
      </div>
    </main>
  );
}

0 Replies