Installing Convert Experiences on a Vue.js app.

Alternative Vue.js Solutions

Vue.js is a Single Page App (SPA) Framework. That means that Vue.js needs a special process to install Convert on it.

A normal web app loads changes via page loads. On SPAs, the changes are loaded via Views which do not need to load the page again.

With the standard implementation, Convert will enable experience changes just after the page has loaded.

The optimal place to enable the changes is after the view has been shown or mounted. Please see the following article to understand the Vue.JS lifecycle.

This article explains how to configure your app to Convert to enable those changes after the view has loaded.

Solution

1) Install the Convert JS tracking code in the HTML of your pages as per the instructions. Choose the method that is more convenient for you.

2) Add the following code to your export default statement:

See the Pen Vue.js Triggering Polling Sequence by Convert.com (@gcrewe) on CodePen.

This code will trigger Convert's polling sequence when the view is "mounted". The polling sequence is the one that checks every single experiment condition for each experience that you have created in your project.

However, you can also trigger a specific experiment to be enabled with the following code:

See the Pen Vue.js Triggering a Specific Experiment by Convert.com (@gcrewe) on CodePen.

Just consider that the experiment conditions will still be tested even with this statement, but only for that specific experiment.