Added use-style-cursor options to GridLayout.

Author: [email protected]

README-zh_CN.md

@@ -279,6 +279,13 @@ Also check https://cli.vuejs.org/guide/build-targets.html#library
 
     设置每个断点对应的列数。
 
+* **useStyleCursor**
+
+    * type: `Boolean`
+    * required: `false`
+    * default: `true`
+
+    标识是否使用动态鼠标指针样式。当拖动出现卡顿时，将此值设为 `false`也许可以缓解布局问题。
 
 ##### GridItem
 

README.md

@@ -24,6 +24,13 @@ English | [简体中文](./README-zh_CN.md)
 - [Getting Started](#getting-started)
   - [Installation](#installation)
     - [npm](#npm)
+    - [browser](#browser)
+  - [Usage](#usage)
+  - [Documentation](#documentation)
+    - [Properties](#properties)
+      - [GridLayout](#gridlayout)
+      - [GridItem](#griditem)
+    - [Events](#events)
 - [Contribute](#contribute)
 - [TODO List](#todo-list)
 
@@ -301,6 +308,13 @@ Include the browser-ready bundle (download from [releases](https://github.com/jb
 
     Defines number of columns for each breakpoint
 
+* **useStyleCursor**
+
+    * type: `Boolean`
+    * required: `false`
+    * default: `true`
+
+    Says if set the `styleCursor` option to true. When dragging freezes, setting this value to `false` may alleviate problems. 
 
 ##### GridItem
 

src/components/GridItem.vue

@@ -203,6 +203,7 @@
                 draggable: null,
                 resizable: null,
                 useCssTransforms: true,
+                useStyleCursor: true,
 
                 isDragging: false,
                 dragging: null,
@@ -312,6 +313,7 @@
                 this.resizable = this.isResizable;
             }
             this.useCssTransforms = this.$parent.useCssTransforms;
+            this.useStyleCursor = this.$parent.useStyleCursor;
             this.createStyle();
         },
         watch: {
@@ -738,6 +740,9 @@
                 const self = this;
                 if (this.interactObj === null || this.interactObj === undefined) {
                     this.interactObj = interact(this.$refs.item);
+                    if (!this.useStyleCursor) {
+                        this.interactObj.styleCursor(false);
+                    }
                 }
                 if (this.draggable && !this.static) {
                     const opts = {
@@ -762,6 +767,9 @@
                 const self = this;
                 if (this.interactObj === null || this.interactObj === undefined) {
                     this.interactObj = interact(this.$refs.item);
+                    if (!this.useStyleCursor) {
+                        this.interactObj.styleCursor(false);
+                    }
                 }
                 if (this.resizable && !this.static) {
                     let maximum = this.calcPosition(0,0,this.maxW, this.maxH);

src/components/GridLayout.vue

@@ -106,6 +106,10 @@
             preventCollision: {
                 type: Boolean,
                 default: false
+            },
+            useStyleCursor: {
+                type: Boolean,
+                default: true
             }
         },
         data: function () {