Add vuex

package.json

@@ -12,6 +12,7 @@
     "vue": "^2.1.10",
     "vue-loader": "^10.1.2",
     "vue-template-compiler": "^2.1.10",
+    "vuex": "^2.1.1",
     "webpack": "^2.2.0",
     "webpack-dev-server": "^1.16.2"
   }

src/App.vue

@@ -3,7 +3,11 @@
 </template>
 
 <script>
+  import {mapState} from 'vuex';
+
   export default {
-    name: 'App'
+    name: 'App',
+    components: {Icon},
+    computed: mapState(['icons'])
   }
 </script>

src/main.js

@@ -1,14 +1,28 @@
 import Vue from 'vue';
+import Vuex from 'vuex';
 import App from './App';
 
-const data = {
+const icons = [
-  icons: [
+  'square',
-    'square',
+  'circle',
-    'circle',
+  'rectangle-vertical',
-    'rectangle-vertical',
+  'rectangle-horizontal'
-    'rectangle-horizontal'
+];
-  ]
+
-};
+Vue.use(Vuex);
+
+const store = new Vuex.Store({
+  state: {
+    icons
+  }
+});
+
+new Vue({
+  el: '#app',
+  store,
+  components: {App},
+  template: '<app/>'
+});
 
 // Vue.component('icon', {
 //   props: {
@@ -55,9 +69,5 @@ const data = {
 //   template: '#icon-container-template'
 // })
 
-new Vue({
+
-  el: '#app',
+
-  data: data,
-  components: {App},
-  template: '<app/>'
-});