|
|
@@ -588,30 +588,30 @@ export default {
|
|
|
},
|
|
|
mounted() {
|
|
|
let _this = this
|
|
|
- _this.$nextTick(() => {
|
|
|
- //创建画布
|
|
|
- _this.stage = new Konva.Stage({
|
|
|
- container: 'container',
|
|
|
- id: 'canvas',
|
|
|
- width: this.options.width,
|
|
|
- height: this.options.height
|
|
|
- })
|
|
|
- _this.orgLayer = new Konva.Layer()
|
|
|
- _this.markLayer = new Konva.Layer()
|
|
|
- _this.stage.add(_this.orgLayer)
|
|
|
- _this.stage.add(_this.markLayer)
|
|
|
- _this.orgLayer.batchDraw()
|
|
|
- _this.bundleScoll()
|
|
|
- _this.stage.on('click', (evt) => {
|
|
|
- _this.tr.nodes([])
|
|
|
- })
|
|
|
- _this.stage.on('mouseover', (evt) => {
|
|
|
- let nodes = _this.tr.nodes()
|
|
|
- if (_this.mouseStatus == 'resize' && nodes.length == 0) _this.mouseStatus = _this.resizeBefore
|
|
|
-
|
|
|
- })
|
|
|
- })
|
|
|
-
|
|
|
+ _this.$nextTick(() => {
|
|
|
+ //创建画布
|
|
|
+ _this.stage = new Konva.Stage({
|
|
|
+ container: 'container',
|
|
|
+ id: 'canvas',
|
|
|
+ width: this.options.width,
|
|
|
+ height: this.options.height
|
|
|
+ })
|
|
|
+ _this.orgLayer = new Konva.Layer()
|
|
|
+ _this.markLayer = new Konva.Layer()
|
|
|
+ _this.stage.add(_this.orgLayer)
|
|
|
+ _this.stage.add(_this.markLayer)
|
|
|
+ _this.orgLayer.batchDraw()
|
|
|
+ _this.bundleScoll()
|
|
|
+ _this.stage.on('click', (evt) => {
|
|
|
+ _this.tr.nodes([])
|
|
|
+ })
|
|
|
+ _this.stage.on('mouseover', (evt) => {
|
|
|
+ let nodes = _this.tr.nodes()
|
|
|
+ if (_this.mouseStatus == 'resize' && nodes.length == 0) _this.mouseStatus = _this.resizeBefore
|
|
|
+
|
|
|
+ })
|
|
|
+ })
|
|
|
+
|
|
|
|
|
|
this.tr = new Konva.Transformer({
|
|
|
rotateEnabled: false,
|
|
|
@@ -640,7 +640,7 @@ export default {
|
|
|
bgImg: {
|
|
|
handler(n, o) {
|
|
|
this.$nextTick(() => {
|
|
|
- this.restore()
|
|
|
+ if (this.stage) this.restore()
|
|
|
this.orgLayer.removeChildren()
|
|
|
this.markLayer.removeChildren()
|
|
|
let imageObj = new Image()
|
|
|
@@ -665,7 +665,7 @@ export default {
|
|
|
this.stage.add(this.orgLayer)
|
|
|
})
|
|
|
},
|
|
|
- immediate: true,
|
|
|
+ // immediate: true,
|
|
|
deep: true
|
|
|
},
|
|
|
drawImgData: {
|
