• Почему когда появляется скрытый Input текст выделяется и приходится еще раз кликать в поле Input?

    @Edy_vse Автор вопроса
    При рендере эл-та нет поэтому ref дает ссылку на null,
    <Stack
                    onDoubleClick={() => handleSetIsInput('title')}
                    direction="row"
                    sx={{ width: '100%' }}
                  >
                    {isInput ? (
                      <StyledFieldFormMin
                        ref={titleRef}
                        version="calculation"
                        name="title"
                        placeholder={
                          formik.isValid ? 'Укажите название работ' : 'Поле обязательно к заполнению'
                        }
                        sx={{
                          '& .MuiFilledInput-input': {
                            '&.MuiInputBase-input': {
                              '&.MuiInputBase-input': {
                                textAlign: 'left',
                              },
                            },
                          },
                        }}
                      />
                    ) : (
                      <StyledTypographyRow sx={{ marginLeft: '12px' }}>{title}</StyledTypographyRow>
                    )}
                  </Stack>

    Необходимо добавить задержку
    const handleSetIsInput = (nameInput: string) => {
        console.log('handleSetIsInput: ');
        setIsInput(true);
        setTimeout(() => {
          if (titleRef.current) {
            if (titleRef.current.querySelector('input')?.name === nameInput)
              titleRef.current.querySelector('input')?.focus();
          }
          if (unitRef.current) {
            if (unitRef.current.querySelector('input')?.name === nameInput)
              unitRef.current.querySelector('input')?.focus();
          }
          if (quantityRef.current) {
            if (quantityRef.current.querySelector('input')?.name === nameInput)
              quantityRef.current.querySelector('input')?.focus();
          }
          if (unitPriceRef.current) {
            if (unitPriceRef.current.querySelector('input')?.name === nameInput)
              unitPriceRef.current.querySelector('input')?.focus();
          }
        }, 1);
      };
    Ответ написан
    Комментировать