diff --git a/canvas-10-feb/src/components/HelloWorld.vue b/canvas-10-feb/src/components/HelloWorld.vue index 191f1c977f0b123512d4f8544f607e0c64ddff09..8743f802f5ca72e80829e342776a1da6bd1cba35 100644 --- a/canvas-10-feb/src/components/HelloWorld.vue +++ b/canvas-10-feb/src/components/HelloWorld.vue @@ -20,6 +20,7 @@ </template> <script> +import { mapState } from 'vuex' var canvas = null export default { @@ -27,24 +28,12 @@ export default { props: { msg: String }, - data: function() { - return { - configRect: { - x: -25, - y: -25, - height: 50, - width: 50, - fill: 'rgb(200, 0, 0)' - }, - configHandle: { - x: 25, - y: 25, - height: 4, - width: 4, - fill: 'black' - } - } - }, + + computed: mapState({ + configRect: state => state.configRect, + configHandle: state => state.configHandle + }), + mounted() { canvas = this.$refs.canvas this.ctx = canvas.getContext('2d') @@ -53,7 +42,6 @@ export default { methods: { draw() { this.box(this.ctx, this.x, this.y) - console.log('draw') }, box(ctx, x, y) { diff --git a/canvas-10-feb/src/store/index.js b/canvas-10-feb/src/store/index.js index 0107c2040384c65960d7c8a62250b35790b426ce..badaf8c340399b01d3fb3f4b0f1163cb9022066a 100644 --- a/canvas-10-feb/src/store/index.js +++ b/canvas-10-feb/src/store/index.js @@ -4,7 +4,22 @@ import Vuex from 'vuex' Vue.use(Vuex) export default new Vuex.Store({ - state: {}, + state: { + configRect: { + x: -25, + y: -25, + height: 50, + width: 50, + fill: 'rgb(200, 0, 0)' + }, + configHandle: { + x: 25, + y: 25, + height: 4, + width: 4, + fill: 'black' + } + }, mutations: {}, actions: {}, modules: {}