时间戳

首页 > 解决方案 > 使用 react-hook-form 将输入框中的值从字符串转换为数组

javascript - 使用 react-hook-form 将输入框中的值从字符串转换为数组

问题描述

我目前有一个使用自定义钩子创建的反应表单：react-hook-form - https://react-hook-form.com/。我有一个输入框，我想输出一个逗号分隔值的数组。即“test1”，“test2”。我当前的实现将数据输出为“test1，test2”。有没有人熟悉将值作为数组而不是字符串取回的方法？这是我所拥有的..

        <label className="form-label" htmlFor="[tenant_authorized_guid]">Tenant_Authorized_Guid(s): 
        <input
          name="[tenant_authorized_guid]"
          placeholder="guid1, guid2, guid3"
          ref={register({
            required: "Required",
            validate: (value) => value !== "",
          })}
        />

我知道在 javascript 中我可以执行 value.split(",") 之类的操作，但目前我不确定如何使用 html 或自定义挂钩来完成此操作。

任何帮助表示赞赏。

标签： javascriptreactjsreact-hook-form

解决方案

可能正在使用受控组件

前任：

  const [value, setValue] = React.useState('');
  const handleChange = (event) => {
    console.log(event.target.value.split(','));
    setValue(event.target.value);
  };
  return (
    <label className="form-label" htmlFor="[tenant_authorized_guid]">
      Tenant_Authorized_Guid(s):
      <input
        name="[tenant_authorized_guid]"
        placeholder="guid1, guid2, guid3"
        value={value}
        onChange={handleChange}
      />
    </label>
  );

推荐阅读