Why is watcher not reactive when creating a component?

Question

Vue.js

I used watcher to work with the search string and display a filtered list, everything works, but I decided to write the value of the search string in localStorage and the reload field, the value is substituted into the search string, but the watcher does not work and there is no reactivity, I tried to use immediate: true, but it did not help:

const seachCityName = ref(localStorage.getItem("seachNameFromLS") || ""); // беру значение из localStorage

the watcher himself:

watch(
    seachCityName,
      () => {
        localStorage.setItem("seachNameFromLS", seachCityName.value); // записываю значение из localStorage
        // тут метод который фильтрует список по значению seachCityName из записывает в $store
    },
  { immediate: true }
);

Answer 1

1. Everything works:
2. It's better to write like this:

watch(
  seachCityName,
  (value) => {
    localStorage.setItem("seachNameFromLS", value); 
    // ...
  },
  { immediate: true }
);

3. Wrap code in <code></code>when asking a question. These are the norms of decency.

Answer 2

watch doesn't work at all? And show a piece of the template where you use seachCityName