Merhaba Arkadaşlar, Nasılsınız? Umarım Hepiniz İyisinizdir. bir hatayla karşı karşıyayım Yakalanmayan TypeError alınıyor: path.split tepki veren bir işlev değil. İşte buradayım Size olası tüm çözümleri burada açıklıyorum.

Vakit kaybetmeden Bu Hatayı Çözmek İçin Bu Yazıya Başlayalım.

Nasıl Yakalanmayan TypeError: path.split tepki veren bir işlev değil Bu Hata Oluşuyor?

Bir Doğrulama Formum Var ve tepki olarak formum için doğrulamalar yapmaya çalışıyorum. Seçtim react-hook-form. Ama sürekli hata alıyorum Path.split is not a function. Web sitelerinde verilen varsayılan örneği kullandıktan sonra bile aynı hatayı alıyorum. Bu, resmi sitede verilen varsayılan koddur.

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

Ve Bu Benim Formum

    <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>

Yakalanmayan TypeError Nasıl Çözülür: path.split tepkide bir işlev değil mi?

Soru: Yakalanmayan TypeError Nasıl Çözülür: path.split tepkideki bir işlev değil mi?
Cevap: tepki-kanca-formu 6.XX’ten 7.0.0’a güncellendi ve kırılma değişiklikleri var: Tüm ref={register} öğelerini {…register(‘value_name’)} ile değiştirmelisiniz.

1. Çözüm

tepki kancası formu 6.XX’ten 7.0.0’a güncellendi ve kırılma değişiklikleri var:

Sadece satırı her yerde kodunuzla değiştirin.

ref={register}

ile

{...register('value_name')}

2. Çözüm

Bunu Deneyin. Malzeme kullanıcı arabirimi veya benzeri bir şey kullanıyorsanız, burada ref={ref} hata verir (çünkü bunun yerine farklı bir prop adı bekler) ref), isteyebilirsiniz

import { TextField } from '@material-ui/core';

const { ref, ...rest } = register('value_name')


return (
 <TextField inputRef={red} {...rest} />
)

3. Çözüm

Basit giriş ile birlikte gereklidir ve hata mesajı özellikler, güncellemede gerekli değişiklikler:

6.xx sürümünden

function MyComponent(props) {
  const { register, handleSubmit, errors } = useForm();

  const onSubmit = (values) => {...};

  return (
    <div>
      <form onSubmit={handleSubmit(onSubmit)}>
        <input
          name="message"
          autoComplete="off"
          ref={register({
            required: "Required",
          })}
        />
        {errors.message && errors.message.message}
        <input type="submit" />
      </form>
    </div>
  );
}

7.xx sürümüne

function MyComponent(props) {
  const { register, handleSubmit, formState: { errors }} = useForm();

  const onSubmit = (values) => {...};

  return (
    <div>
      <form onSubmit={handleSubmit(onSubmit)}>
        <input
          name="message"
          autoComplete="off"
          {...register("message", {
            required: "Required",
          })}
        />
        {errors.message && errors.message.message}
        <input type="submit" />
      </form>
    </div>
  );
}

Kayıt düzeltmesine ek olarak, useForm()’daki hataları kullanırsanız, şimdi hatalar özellik şuradan dışa aktarılır: formDevlet.

yazlık

Her şey bu konuyla ilgili. Umarım tüm çözümler size çok yardımcı olmuştur. Düşünceleriniz ve sorularınızın altına yorum yapın. Ayrıca, sizin için hangi çözümün işe yaradığını aşağıya yorumlayın?

Ayrıca Okuyun