英文:
TextInput Component suddenly not working in production Laravel 10 Reactjs
问题
我遇到了laravel reactjs的TextInput组件的奇怪问题。
我从laravel breeze reactjs获取了这个组件。
问题是我无法在<TextInput>上键入任何内容，但如果我将其更改为<input>标签，它可以正常工作。直到今天，<TextInput>突然停止工作，我没有更改任何内容，因为它是laravel自带的，在本地开发中，除了我没有在本地运行npm run build之外，它完全相同。
我已经运行了npm run build并重新启动了ssr服务器，但没有运气。
以下是Login.jsx中的一个TextInput示例：
<TextInput
id="email"
type="email"
name="email"
value={data.email}
className="mt-1 block w-full"
autoComplete="username"
isFocused={true}
handleChange={onHandleChange}
/>
如果我更改为这个input，它可以正常工作：
<input
type="email"
name="email"
id="email"
value={data.email}
className="border-gray-300 focus:border-indigo-500 focus:ring-indigo-500 rounded-md shadow-sm mt-1 block w-full"
autoComplete="username"
required
onChange={onHandleChange}
/>
通过对组件文件TextInput.jsx和CheckBox.jsx（也出现了问题）进行任何更改，然后再次运行npm run build，组件似乎又可以正常工作。
有什么想法是出了什么问题？
英文:
I got weird problem with TextInput Component from laravel reactjs.
I got the component from laravel breeze reactjs.
The problem is I cant type anything on the <TextInput>, but if i change it to <input> tag it works fine. It was working fine till today suddenly <TextInput> stop working, I didnt change anything because it comes with laravel and it works fine in local development exactly same code except I didnt do npm run build on local.
I already did npm run build and restart ssr server, no luck.
Here is one of the TextInput from Login.jsx
> <TextInput
> id="email"
> type="email"
> name="email"
> value={data.email}
> className="mt-1 block w-full"
> autoComplete="username"
> isFocused={true}
> handleChange={onHandleChange}
>
> />
If I change it to this input, it works
<input
type="email"
name="email"
id="email"
value={data.email}
className={
'border-gray-300 focus:border-indigo-500 focus:ring-indigo-500 rounded-md shadow-sm mt-1 block w-full'
}
autoComplete="username"
required
onChange={onHandleChange}
/>
It seems the component works again by making any changes to the component files, TextInput.jsx and CheckBox.jsx (was broken too). then run npm run build again.
Any idea what went wrong?
答案1
得分: 2
我今天也遇到了同样的问题，解决方法是在 TextInput.jsx 中将 ref 从：
ref={localRef}
改为：
ref={input}
英文:
I was facing the same issue today and solve it changing ref in TextInput.jsx
from:
ref={localRef}
To:
ref={input}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论