receivedData может быть фиксированное количество записей фиксированных размеров, то условно как-то так:<div v-if="loading">
<div v-for="foo in 10" class="fixed-size loading"></div>
Loading
</div>
<div v-else>
<div v-for="foo in receivedData.foo" class="fixed-size">{{ foo }}</div>
{{ receivedData.bar }}
</div>const products = {
value: false
};
console.log(products)
console.log(products.value)
products.value = true;ref в данном случае никакой.ref.value ты уже получил текущее значение, если оно изменилось позже, то ты об этом никак не узнаешь, не поучив снова ref.value. Собсно потому и нужно это уродское .value, т.к. в js (пока?) нет нативных ref-ссылок приходится везде тащить объект-обёртку.
<compnent-group-name>.variables.scss и импортируете его куда надо. props. Каждый отдельный компонент - чёрный ящик. У тебя должна быть возможность полностью и кардинально изменить вёрстку внутри компонента, не изменив его поведение. В vue 3 для этого даже есть удобная конструкция v-bind внутри <style>.$gap глобальный параметр, можно в конфиге vue\sass-loader добавить общий для всех файл с переменными.
if(to.path === '/auth/verify-email') next() или типа того.
this внутри function зависит от контекста вызова этой function.onAuthStateChanged - вызывается переданная ему функция-обработчик, которой устанавливается какой-то this(или не устанавливается, и тогда он по умолчанию window или, в строгом режиме, undefined). И этот this точно никак не связан с текущим this Vue, потому что тот никаким образом не передан при вызове, и, соответственно onAuthStateChanged о нём ничего не знает.(async function(user) { ... }).bind(this) чтобы жёстко привязать эту функцию к this.vm.g = 5;, т.к. таким образом конкретный this сохранён в переменную и не меняется в зависимости от контекста вызова.async (user) => { ... }, её механика работы по сути осуществляет неявный bind.bind всех методов к this:onAuthStateChanged(this.onAuthStateChanged)
methods: {
onAuthStateChanged: async function (user) { ... }
}firefox есть такая нестандартная фича как -moz-element, которая идеально подходит под задачу: canvas движке(можно попробовать что-то такое), и тогда просто получать копию холста на меньший canvas. Это более оптимально но требует переписывание всего и сложности основной работы.Vue.observable\reactive или vuex), один из которых уменьшать с помощью transform: scale().html2canvas, предложенный выше, имеет очень ограниченную область применения и вряд ли тут сработает, но можете попробоватьthis.$el.cloneNode(true) и класть полученную копию в нужное место с тем же transform: scale(), но это может весьма сильно тормозить в зависимости от количества элементов и частоты обновления.
components: {
some: () => import('@/components/some.vue')
}Vue.component('some', () => import('@/components/some.vue'));