В API композиции Vue3 заставить наблюдателя работать немедленно

Использование API композиции Vue3. Как сделать так, чтобы смотрел сразу работал. Следующий код не работает.

watch((immediate=true) => props.isOpen, () => {
        if (props.isOpen && props.preventBackgroundScrolling) {
          document.body.style.setProperty('overflow', 'hidden')
        } else {
          document.body.style.removeProperty('overflow')
        }

          });

person user3541631    schedule 30.11.2020    source источник


Ответы (1)


Он должен быть размещен как вариант:

watch(() => props.isOpen, () => {
        if (props.isOpen && props.preventBackgroundScrolling) {
          document.body.style.setProperty('overflow', 'hidden')
        } else {
          document.body.style.removeProperty('overflow')
        }

          },{immediate:true});

or

watch('props.isOpen', () => {
        if (props.isOpen && props.preventBackgroundScrolling) {
          document.body.style.setProperty('overflow', 'hidden')
        } else {
          document.body.style.removeProperty('overflow')
        }

          },
       {immediate:true}
   );

person Boussadjra Brahim    schedule 30.11.2020
comment
Просто чтобы что-то добавить: рекомендуется использовать toRefs. Используйте это так: const { isOpen } = toRefs(props); - person Philipp Mochine; 07.07.2021
comment
Да, это тоже хороший совет - person Boussadjra Brahim; 07.07.2021