It's a bit early in your learning, but let's take a few moments to review Vue components, using the previous example of a counter. What if you wanted multiple counters on the page, each with their own sets of data? How would we accomplish that?
View the completed example for this introductory lesson on JSBin (don't forget to press "Run With JS").
Let's focus on a practical, real-life example, using a subscription plan page. How do we differentiate between upgrades and downgrades? How do we select active plans? How do we perform two-way binding with custom components? As always, with Vue, it's a cinch.
View the source for this lesson on JsFiddle.
Often, you'll find yourself in the position of wanting a form to submit asynchronously. Or, in other words, rather than performing a full post back to the server and refreshing the page, we'd rather opt for a simple AJAX request behind the scenes. Well at this point in your learning, you already know one way to hijack a form's submission, but what if we could instead create a reusable Vue directive to simplify things? What if we could simply add
v-ajax to a form tag, and have it automatically switch to using AJAX for its submission?
View the source for this lesson on GitHub.
In the previous episode, we reviewed the basic concept of how you might create and organize view-specific components for a traditional server-side application. Now, let's see exactly what that looks like, within the context of a fresh Laravel application.
View the source code for this lesson on GitHub.