if (localStorage.getItem('mediaObjViewSeen') === true) {
Было бы круто, если вы хотя бы поверхностно
знакомились с инструментом, прежде чем его использовать:
Ключи и значения всегда строки
Строка не может быть равна булеву значению, сами (надеюсь) понимаете.
Но вообще, по-хорошему, проверять ничего не надо - вместо двух булевых свойств должно быть одно строковое, обозначающее, в каком виде представлять данные:
data: () => ({
view: localStorage.getItem('view') || 'CardsView',
// ...
}),
watch: {
view: val => localStorage.setItem('view', val),
},
Описания доступных вариантов представления складываете в массив, на основе этого массива создаёте кнопки для переключения представлений:
data: () => ({
views: [
{
name: 'CardsView',
btnClass: 'btn-left',
img: '...',
},
{
name: 'MediaObjView',
btnClass: 'btn-right',
img: '...',
},
],
// ...
}),
<button
v-for="n in views"
:class="[ n.btnClass, view === n.name ? 'btn-active' : '' ]"
@click="view = n.name"
>
<img :src="n.img">
</button>
Передаёте
view
в
TweetPreview
, используете его значение как имя компонента:
<component
:is="view"
:tweet="tweet"
/>