Skip to main content
Package: @react-form-builder/components-fast-qr

​
Overview

This component is in a separate NPM package @react-form-builder/components-fast-qr. It is based on fast_qr package.

​
Installation

Use the following command to install the package: 
npm install @react-form-builder/components-fast-qr

​
Connection to FormBuilder component

The example below assumes that you also have the components from the @react-form-builder/components-rsuite package installed and the QR code component is additionally attached:
jsx

const components = rSuiteComponents.map((c) => c.build())
const builderView = new BuilderView([...components, fastQrComponent.build()])

function App() {
  return <FormBuilder view={builderView}/>
}

​
Connect to FormViewer component

The example below shows how to connect the QR code component along with the @react-form-builder/components-rsuite components:
jsx showLineNumbers

const components = [
  ...rSuiteComponents.map((c) => c.build().model),
  fastQrModel,
]
const view = new View(components)

const form = `{
  "form": {
    "key": "Screen",
    "type": "Screen",
    "props": {},
    "children": [
      {
        "key": "qrCode",
        "type": "FastQR",
        "props": {}
      }
    ]
  }
}`

function App() {
  return <FormViewer view={view} getForm={() => form}/>
}
Last modified on April 16, 2026