小编gee*_*rry的帖子

我正在使用 react-hook-forms Controller api 围绕来自 react-select 的 AsyncSelect 加载选项，因为用户从外部 API 键入。一切正常，除了返回的值作为字符串"[object Object]"而不是对象的 fullName 属性返回。

我的组件：

           <Controller
            control={control}
            name="businessCategory"
            as={
              <AsyncSelect
                className="react-select-container"
                loadOptions={v => handleAutocompleteLookup(v)}
                onChange={handleCategoryInputChange}
                getOptionLabel={option => option.name}
                getOptionValue={option => option.fullName}
              />
            }
          />

我的 handleChange 函数。SetValue 来自 react-hook-form：

  const handleCategoryInputChange = newValue => {
    return setValue('businessCategory', newValue, true);
  };

我的任何数据都是具有以下形状的对象数组：

{
  fullName: "DJ service"
  id: "gcid:dj"
  name: "DJ service"
  publisher: "GMB"
}

任何有关这方面的线索将不胜感激，谢谢！

我正在制作一个 formik 表单，除了我的复选框字段之外，每个字段都正确设置和发送值。我真的找不到关于它的好的文档，所以想知道是否有人可以帮助我。

我对 formik 函数的价值观的支持：

  mapPropsToValues: props => ({
    firstName: props.firstName || '',
    lastName: props.lastName || '',
    businessName: props.businessName || '',
    email: props.email || '',
    phone: props.phone || '',
    zipCode: props.zipCode || '',
    yearsInBusiness: props.yearsInBusiness || '',
    callBackTime: props.callBackTime || '',
    paymentServices: [],
    paymentProcessing: props.paymentProcessing || ''
  }),

还有我的输入框。

 <CheckboxField
   type="checkbox"
   name="paymentProcessing"
   value={values.paymentProcessing}
   label="Payment Processing Equipment"
  />

如果选中的话，我基本上需要复选框字段的值等于标签

我正在尝试使用 yup 进行密码验证，其中至少满足 4 个密码条件中的 3 个。我很难找到现有的方法来做到这一点。

我的要求是这样的：

\n

至少 8 个字符 必须使用以下四种字符类型中至少三种\n的字符： \xe2\x80\xa2 英文字母大写\n字母 (AZ) \xe2\x80\xa2 英文字母小写字母 (az) \xe2\ x80\xa2 数字\n(0-9) \xe2\x80\xa2 非字母数字符号（例如 !、#、$、%）

\n

我的验证（使用react-hook-form）是这样的：

newPassword: yup\n.string()\n.required('Please enter a password')\n.min(8, 'Password too short')\n.matches(/^(?=.*[a-z])/, 'Must contain at least one lowercase character')\n.matches(/^(?=.*[A-Z])/, 'Must contain at least one uppercase character')\n.matches(/^(?=.*[0-9])/, 'Must contain at least one number')\n.matches(/^(?=.*[!@#%&])/, 'Must contain at least one special character'),\n

问题是，这当然需要所有 4 个条件，而实际上只需要 4 个条件中的至少 3 个。任何解决此问题的帮助将不胜感激！谢谢

所以我有 JSON 数据，其中包括位于我的公共文件夹 (/public/images) 中的图像的路径。像这样，

const data = [
{
    "key": 1,
    "name": "Goal Squad",
    "techs": ["React & Redux", "Express", "MySQL"],
    "description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et",
    "image": "../public/images/test.jpg"
},
{
    "key": 2,
    "name": "WesterosCraft",
    "techs": ["React & Redux", "Express", "MySQL"],
    "description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et",
    "image": "../public/images/test.jpg"
},

根据阅读其他一些类似情况，这就是我在我的组件中尝试过的；

class Card extends Component  {

render() { …

我正在使用 Formik + Yup 构建一个表单，但似乎无法通过一个基本问题，我觉得我错过了一些明显的东西。我的handleSubmit 函数不会在单击按钮时触发 - 即使是像控制台日志这样简单的东西。如果我向 onClick 按钮处理程序添加一个纯函数，它会触发，但 Formik 似乎没有传递使用 withFormik HOC 构造的handleSubmit。

我尝试将处理程序添加到 Form 组件，但在那里也不起作用。

const formikEnhancer = withFormik({\n  mapPropsToValues: props => ({\n    firstName: props.firstName || \'\',\n    ...\n  }),\n  validationSchema: yup.object().shape({\n    firstName: yup.string().required(\'Please enter your first name\'),\n   ...\n  }),\n  handleSubmit: (values, formikBag) => {\n    console.log(\'test\');\n    }\n  },\n});\n\nconst BusinessFundingForm = ({\n  values,\n  isSubmitting,\n  errors,\n  handleBlur,\n  handleChange,\n  handleSubmit,\n  touched,\n  data,\n}) => {\n\n  return (\n        <Form className="form" id="form-id">\n          <Row>\n            <Col xs={12} sm={6}>\n              <InputField\n                id="first-name"\n                type="text"\n                name="firstName"\n                value={values.firstName}\n                onChange={handleChange}\n …