To solve Uncaught TypeError: path.split is not a function in react error follow below methods. In react, while attempting to validate a form. Sometimes you will caught with the “react-hook-form” library and keep receiving the problem “Path.split is not a function.” Receiving the same error even after using the default sample provided on their page. This is the official website’s default code.
import React from "react";
import { useForm } from "react-hook-form";
export default function App() {
const { register, handleSubmit, watch, errors } = useForm();
const onSubmit = data => console.log(data); //Console Log
And the Form is:
<form onSubmit={handleSubmit(onSubmit)}>
{/* register your input into the hook by invoking the "register" function */}
<input name="example" defaultValue="test" ref={register} />
{/* include validation with required or other standard HTML validation rules */}
<input name="exampleRequired" ref={register({ required: true })} />
{/* errors will return when field validation fails */}
{errors.exampleRequired && <span>This field is required</span>}
<input type="submit" />
</form>
Contents
How to solve TypeError: path.split is not a function in react ?
To solve the TypeError: path.split is not a function in react issue. The react-hook-form should be updated to 7.0.0 from 6.X.X and has breaking changes:
You have to replace all ref={register}
with {...register('value_name')}
Example:
In Version 6.X.X:
<input ref={register({ required: true })} name="test" />
In Version 7.0.X:
<input {...register('test', { required: true })} />
Alternative to Solve TypeError: path.split is not a function in react
It is worth noting that if you are using material ui or anything similar and ref=ref raises an error (since it expects a different prop name instead of ref), you may want to change your code.
import { TextField } from '@material-ui/core';
return (
<TextField {...register('name')} />
)
Hope the above solution works.
Also read :
ImportError cannot import name ‘_endpoint_from_view_func’ from ‘flask.helpers’
ModuleNotFoundError: No module named ‘grp’ on windows