D
serverPrefetch называется во вью
Size: a a a
2020 March 08
Д
Сейчас если в режиме spa переходить со страницы на страницу async fetch или asyncData фризит переход пока эти методы не отработаю а хочется переход сразу и пусть крутится лоадер. Тогда ощущение приятнее от пользования
Д
В режиме же ssr понятно, лоадер не нужен, это когда прямой заход по ссылке
А
serverPrefetch называется во вью
не очень понимаю, как он работает. он вызывается только на сервере, получает данные, рисует хтмл и как-то сериализует данные для попадания на клиент, правильно? и все это до создания экземпляра компонента? а как тогда на клиенте это себя ведет?
D
хз, будем пробовать
А
ну точнее сериализует не сам serverPrefetch, а просто подразумевает что это будет сделано
А
Мы будем использовать опцию serverPrefetch (добавлена в версии 2.6.0+) в компонентах. Эта опция распознаётся рендерингом на стороне сервера и приостанавливает отрисовку до тех пор, пока Promise не разрешится. Это позволяет нам «дожидаться» асинхронных данных в процессе отрисовки.
А
т.е. можно предположить, что он все таки где-то в районе created вызывается
D
Сейчас если в режиме spa переходить со страницы на страницу async fetch или asyncData фризит переход пока эти методы не отработаю а хочется переход сразу и пусть крутится лоадер. Тогда ощущение приятнее от пользования
это можно реализовать небольшим костылем и сейчас (асинкдата + маунтед хук), но дело в том что транзишн фризится не только из-за асинкдаты, а бывает что нужно еще чанк роута скачать, тут уже ничего не поделать, будет небольшой фриз
D
т.е. можно предположить, что он все таки где-то в районе created вызывается
да, только я так понимаю в отличии от асинкдаты, фетчи разных компонентов не могут выполняться параллельно
Д
это можно реализовать небольшим костылем и сейчас (асинкдата + маунтед хук), но дело в том что транзишн фризится не только из-за асинкдаты, а бывает что нужно еще чанк роута скачать, тут уже ничего не поделать, будет небольшой фриз
А prefetch не поможет? Или бред?
D
и оптимальнее всего все равно юзать асинкдату если это удобно, потому что там есть Promise.all
А
звучит как возможность выстрела в ногу
А
люди начнут писать фетч в пяти компонентах и смысл асинхронности убьется
D
А prefetch не поможет? Или бред?
типа то что нухт грузит чанки при наведении на ссылку? должно помочь, да
D
а префечить все чанки сразу нет смысла, иначе зачем их вообще делать? суть в том чтоб не грузить то что не используется на данном роуте
Д
типа то что нухт грузит чанки при наведении на ссылку? должно помочь, да
Даже не знал что при наведении на ссылку подгружает чанк. Спасибо!
NE
Здравствуйте! Возник вопрос, как совершить передачу данных на NUXTJS с сервера на клиент, ранее подобных не занимался, по этому совершенно не понимаю как это работает, на сколько я понимаю на сервере я должен сделать нечто подобное
const TestVar = {
name: "Ivan"
};
app.get("/api/test", function(req, res) {
res.json(TestVar);
});
А на клиенте сделать обычный ajax по типу
mounted() {
fetch("/api/test").then(function(response) {
console.log(response)
});
}
но это не работает, подскажите как быть и как это должно работать, а так же где об этом можно почитать? Спасибо!
const TestVar = {
name: "Ivan"
};
app.get("/api/test", function(req, res) {
res.json(TestVar);
});
А на клиенте сделать обычный ajax по типу
mounted() {
fetch("/api/test").then(function(response) {
console.log(response)
});
}
но это не работает, подскажите как быть и как это должно работать, а так же где об этом можно почитать? Спасибо!
Vi
А можно как то из страницы передать данные слою(layout)? Не используя vuex
Vi
New Era
Здравствуйте! Возник вопрос, как совершить передачу данных на NUXTJS с сервера на клиент, ранее подобных не занимался, по этому совершенно не понимаю как это работает, на сколько я понимаю на сервере я должен сделать нечто подобное
const TestVar = {
name: "Ivan"
};
app.get("/api/test", function(req, res) {
res.json(TestVar);
});
А на клиенте сделать обычный ajax по типу
mounted() {
fetch("/api/test").then(function(response) {
console.log(response)
});
}
но это не работает, подскажите как быть и как это должно работать, а так же где об этом можно почитать? Спасибо!
const TestVar = {
name: "Ivan"
};
app.get("/api/test", function(req, res) {
res.json(TestVar);
});
А на клиенте сделать обычный ajax по типу
mounted() {
fetch("/api/test").then(function(response) {
console.log(response)
});
}
но это не работает, подскажите как быть и как это должно работать, а так же где об этом можно почитать? Спасибо!
Можно использовать serverMiddleware. В официальной документации накста есть такая страница с описанием