Vue.js 2 Design Patterns and Best Practices

v-else-if

Whilst v-else works well in standard IF NOT A then B scenarios, you may want to test for multiple values and show a different template. Similar to v-else, we can use v-else-if to change the behavior of our application. For this example, we'll have fun by using a generator as introduced with ES2015.

To use the generator, we'll need to install the babel-polyfill package; this also allows us to use things such as async and await better promise handling:

$ npm install babel-polyfill --save-dev

After installing it, we can modify our Webpack configuration (webpack.config.js) to include it inside of our entry files:

module.exports = { entry: ['babel-polyfill', './src/main.js'], output: {  path: path.resolve(__dirname, './dist'), publicPath: ...