react icon indicating copy to clipboard operation
react copied to clipboard

ReferenceError: navigator is not defined in Nextjs

Open upfounders opened this issue 2 years ago • 2 comments

I am creating form with formio in Nextjs project got this error, anyone see this problem, and any workaround?

error - ReferenceError: navigator is not defined at Object. (/Users/kilghar/Documents/Code/uf-next/node_modules/formiojs/components/file/File.js:120:21)

upfounders avatar Oct 06 '23 04:10 upfounders

I have the same problem, even using the 'use client' directive of nextjs.

enkinduweles avatar Oct 17 '23 19:10 enkinduweles

You to load the form dynamically and avoid any SSR, you will get rid of that problem.

import dynamic from 'next/dynamic'

const Form = dynamic<FormioFormProps>(() => import('@formio/react').then(mod => mod.Form), {
  ssr: false,
  loading: () => <p>Loading...</p>,
})

You continue using your form like you usually do

/*your commponent*/
return ( <Form
          formReady={onFormReady}
          options={options} .....
          

Dalorzo avatar Nov 06 '23 10:11 Dalorzo