Как сделать так, чтобы при перезагрузке страницы сохранялся выбранный вариант в выпадающем списке?

Как можно сохранить выбранный вариант option при перезагрузке страницы, аналогично сохранению данных при вводе в input на приведенной ниже песочнице?
https://playcode.io/1701091
  • 20 декабря 2023 г. 14:07
Ответы на вопрос 2
Для сохранения выбранного варианта в выпадающем списке при перезагрузке страницы можно использовать JavaScript и localStorage.

Вот пример кода:

HTML:
```html
<select id="mySelect">
  <option value="option1">Option 1</option>
  <option value="option2">Option 2</option>
  <option value="option3">Option 3</option>
</select>
```

JavaScript:
```javascript
// Получаем элемент выпадающего списка
var selectElement = document.getElementById("mySelect");

// При загрузке страницы
window.onload = function() {
  // Проверяем, сохранен ли выбранный вариант в localStorage
  if (localStorage.getItem("selectedOption")) {
    // Если да, устанавливаем его как выбранный вариант в выпадающем списке
    selectElement.value = localStorage.getItem("selectedOption");
  }
}

// При изменении выбранного варианта
selectElement.onchange = function() {
  // Сохраняем выбранный вариант в localStorage
  localStorage.setItem("selectedOption", selectElement.value);
}
```

В этом коде мы используем localStorage для сохранения выбранного варианта при изменении и восстановления его при загрузке страницы. При изменении выбранного варианта, мы сохраняем его значение в localStorage с помощью метода `setItem()`, используя ключ "selectedOption". При загрузке страницы, мы проверяем, есть ли сохраненное значение в localStorage с помощью метода `getItem()`, и если оно есть, устанавливаем его как выбранный вариант в выпадающем списке.
Внутри селекта нет никакого кода, который устанавливал бы его value. 

Ну привязывать v-model к compuded, который возвращает prop явно некорректно. Ни computed ни prop не перезаписываются (computed можно через get/set, но это другое).
Похожие вопросы