Reader small image

You're reading from  Vue.js 2 Cookbook

Product typeBook
Published inApr 2017
Reading LevelBeginner
PublisherPackt
ISBN-139781786468093
Edition1st Edition
Languages
Right arrow
Author (1)
Andrea Passaglia
Andrea Passaglia
author image
Andrea Passaglia

Andrea Passaglia was born in Genoa, in northern Italy. Interested about technology since his parents gave him a toy computer when he was a boy, he started studying web technologies at an early age. After obtaining his master's degree in computer engineering he worked on the design and implementation of web interfaces for companies of various sizes and in different industries (healthcare, fashion, tourism, and transport). In 2016 he moves in the silicon valley of Europe to tackle new problems in the banking industry at the Edgeverve Dublin Research and Development Labs. A backend technologist by trade, Vue.js is his first tool to bring to life his creations when it comes to the frontend. Andrea is married to a lovely Russian girl from Siberia and they often cook together mixing culinary traditions.
Read more about Andrea Passaglia

Right arrow

Loading your components asynchronously


Sometimes you need to load components while the app is already running. This can be because you have so many components that it will be too cumbersome to load all of them or maybe the shape of some component is not known in advance. With Vue, you can load components only when they have to actually render. Next time the component will need to be rendered, it will be retrieved from cache.

Getting ready

You want to load your component asynchronously only when you already know how to make AJAX requests with Vue. In this recipe, though, we will skip those, so you can follow along right away.

How to do it...

Let's suppose that we have a big vase e-commerce. We have one component for every vase, but we can't give them all to the user at once. It will be too much data. We will load the component from the Internet.

As only modification, we will simulate the AJAX call with a simple setTimeout. Let's go back to our favorite online editor, JSFiddle:

Vue.component('XuandePeriodVase...
lock icon
The rest of the page is locked
Previous PageNext Page
You have been reading a chapter from
Vue.js 2 Cookbook
Published in: Apr 2017Publisher: PacktISBN-13: 9781786468093

Author (1)

author image
Andrea Passaglia

Andrea Passaglia was born in Genoa, in northern Italy. Interested about technology since his parents gave him a toy computer when he was a boy, he started studying web technologies at an early age. After obtaining his master's degree in computer engineering he worked on the design and implementation of web interfaces for companies of various sizes and in different industries (healthcare, fashion, tourism, and transport). In 2016 he moves in the silicon valley of Europe to tackle new problems in the banking industry at the Edgeverve Dublin Research and Development Labs. A backend technologist by trade, Vue.js is his first tool to bring to life his creations when it comes to the frontend. Andrea is married to a lovely Russian girl from Siberia and they often cook together mixing culinary traditions.
Read more about Andrea Passaglia