Блог

В настоящее время я работаю над библиотекой для react и точно не знаю, как технически я могу реализовать функцию, которую имею в виду.

В основном это библиотека проверки формы, и вся конфигурация идет как парам к крючку. Выглядит так:

 const myFormReferenceObject = useForm({
    onSubmit: (values) => {
        // do whatever you want with the values
    },
    initialState: record,
    formatMessage: translate,
    submitUnmountedFields: false
});
 

Дело в том, что я думаю, что было бы очень полезно иметь какую-то глобальную конфигурацию, чтобы вам не приходилось повторять себя 100 раз для каждой создаваемой формы.

Моя первая идея состояла в том, чтобы сделать это подобно axios, где вы создаете экземпляр axios и настраиваете его глобально. Теперь у меня нет объекта экземпляра, так как я просто вызываю функцию/реагирую на хук.

Затем у меня возникла идея создать пространство имен в объекте window с конфигурацией, лежащей там. Тогда мой крючок всегда мог проверить, есть ли конфигурация в этом окне[«пространство имен»], чтобы настроить или переопределить все формы сразу.

Другим, возможно, более эффективным способом сделать это было бы создать контекст для конфигурации. Но, честно говоря, я действительно не хочу делать это таким образом, потому что сама библиотека очень проста и удобна в использовании. 1. Вызовите крючок для создания формы, 2. передайте ссылку на форму в каждое поле ввода с валидатором уровня поля и реквизитами и т.д. Мне нравится простота, и добавление контекста как бы разрушает простоту, так как вам всегда приходится окружать свои компоненты контекстом. С другой стороны, тогда у вас могло бы быть несколько контекстов для разных модулей в приложении, что тоже было бы довольно круто.

У вас есть идея получше или вы думаете, что мне следует просто использовать подход с окном?

Если у вас есть глобальная конфигурация, вы можете просто использовать ее при вызове useForm .

 const myFormReferenceObject = useForm({
    ...myGlobalConfig,
    onSubmit: (values) => {
        // do whatever you want with the values
    },
});
 

Также, если вы используете оконный подход, вы можете сделать window[a symbol] это вместо window[a string] того, чтобы избегать конфликтов.