2222
2323### Features
2424
25- * A lightweight, no-dependency
25+ * A lightweight, no-dependency
2626* All props are reactive
2727* Support touch events
2828* Use draggable, resizable or both
@@ -98,7 +98,8 @@ Type: `Boolean`<br>
9898Required: ` false ` <br >
9999Default: ` false `
100100
101- Determines whether the component should be active.
101+ Determines whether the component should be active.
102+ 确定组件是否应处于活动状态。
102103
103104``` html
104105<vue-drag-resize :isActive =" true" >
@@ -112,6 +113,9 @@ Default: `false`
112113Disable behavior of the component by clicking on it and clicking outside the component's area (isActive: true / false).
113114If the prop is enabled, the component is oriented only to the specified.
114115
116+ 通过单击组件并单击组件区域外部来禁用组件的行为(isActive:true / false)。
117+ 如果启用了prop,则组件仅面向指定的。
118+
115119``` html
116120<vue-drag-resize :preventActiveBehavior =" true" >
117121```
@@ -123,7 +127,8 @@ Default: `0`
123127
124128Define the initial width of the parent element. If not specified it calculated automatically.
125129With this parameter, you can set the bounding area for the component, and also it is used when resizing in real time.
126-
130+ 定义父元素的初始宽度。 如果未指定,则自动计算。
131+ 使用此参数,您可以设置组件的边界区域,并在实时调整大小时使用它。
127132``` html
128133<vue-drag-resize :parentW =" 2000" >
129134```
@@ -135,6 +140,8 @@ Default: `0`
135140
136141Define the initial height of the parent element. If not specified it calculated automatically.
137142With this parameter, you can set the bounding area for the component, and also it is used when resizing in real time.
143+ 定义父元素的初始高度。 如果未指定,则自动计算。
144+ 使用此参数,您可以设置组件的边界区域,并在实时调整大小时使用它。
138145
139146``` html
140147<vue-drag-resize :parentH =" 2000" >
@@ -147,7 +154,8 @@ Default: `1`
147154
148155Define the initial horizontal scale or the parent element. Same value in parent's transform: scale() css definition.
149156The drag/resize and the sticks' sizes will computed with this value.
150-
157+ 定义初始水平比例或父元素。父级的transform: scale ()css定义中的值相同。
158+ 拖动/调整大小和杆的大小将使用该值计算。
151159``` html
152160<vue-drag-resize :parentScaleX =" 0.5" >
153161```
@@ -159,6 +167,9 @@ Default: `1`
159167
160168Define the initial vertical scale or the parent element. Same value in parent's transform: scale() css definition.
161169The drag/resize and the sticks' sizes will computed with this value.
170+ 定义初始垂直比例或父元素。父级的transform: scale ()css定义中的值相同。
171+
172+ 拖动/调整大小和杆的大小将使用该值计算。
162173
163174``` html
164175<vue-drag-resize :parentScaleY =" 0.5" >
@@ -170,6 +181,8 @@ Required: `false`<br>
170181Default: ` true `
171182
172183Determines whether the component should draggable.
184+ 确定组件是否应可拖动。
185+
173186
174187``` html
175188<vue-drag-resize :isDraggable =" false" >
@@ -181,53 +194,23 @@ Required: `false`<br>
181194Default: ` true `
182195
183196Determines whether the component should resize.
197+ 确定组件是否应调整大小。
198+
184199
185200``` html
186201<vue-drag-resize :isResizable =" false" >
187202```
188-
189203#### parentLimitation
190204Type: ` Boolean ` <br >
191205Required: ` false ` <br >
192206Default: ` false `
193207
194208Limits the scope of the component's change to its parent size.
209+ 将组件更改的范围限制为其父大小。
195210
196- ``` html
197- <vue-drag-resize :parentLimitation =" true" >
198- ```
199-
200- #### snapToGrid
201- Type: ` Boolean ` <br >
202- Required: ` false ` <br >
203- Default: ` false `
204-
205- Determines whether the component should move and resize in predefined steps.
206-
207- ``` html
208- <vue-drag-resize :snapToGrid =" true" >
209- ```
210-
211- #### gridX
212- Type: ` Number ` <br >
213- Required: ` false ` <br >
214- Default: ` 50 `
215-
216- Define the grid step size for the horizontal axis. Both sides of the component (left and right) will snap to this step.
217-
218- ``` html
219- <vue-drag-resize :snapToGrid =" true" :gridX =" 20" >
220- ```
221-
222- #### gridY
223- Type: ` Number ` <br >
224- Required: ` false ` <br >
225- Default: ` 50 `
226-
227- Define the grid step size for the vertical axis. Both sides of the component (top and bottom) will snap to this step.
228211
229212``` html
230- <vue-drag-resize :snapToGrid =" true" :gridY = " 20 " >
213+ <vue-drag-resize :parentLimitation =" true" >
231214```
232215
233216#### aspectRatio
@@ -236,6 +219,8 @@ Required: `false`<br>
236219Default: ` false `
237220
238221Determines whether the component should retain its proportions.
222+ 确定组件是否应保持其比例。
223+
239224
240225``` html
241226<vue-drag-resize :aspectRatio =" false" >
@@ -247,6 +232,8 @@ Required: `false`<br>
247232Default: ` 200 `
248233
249234Define the initial width of the component.
235+ 定义组件的初始宽度。
236+
250237
251238``` html
252239<vue-drag-resize :w =" 200" >
@@ -258,6 +245,9 @@ Required: `false`<br>
258245Default: ` 200 `
259246
260247Define the initial height of the component.
248+ 定义组件的初始高度。
249+
250+
261251
262252``` html
263253<vue-drag-resize :h =" 200" >
@@ -269,6 +259,9 @@ Required: `false`<br>
269259Default: ` 50 `
270260
271261Define the minimal width of the component.
262+ 定义组件的初始宽度。
263+
264+
272265
273266``` html
274267<vue-drag-resize :minw =" 50" >
@@ -280,6 +273,8 @@ Required: `false`<br>
280273Default: ` 50 `
281274
282275Define the minimal height of the component.
276+ 定义组件的最小高度。
277+
283278
284279``` html
285280<vue-drag-resize :minh =" 50" >
@@ -291,6 +286,8 @@ Required: `false`<br>
291286Default: ` 0 `
292287
293288Define the initial x position of the component.
289+ 定义组件的初始X位置。
290+
294291
295292``` html
296293<vue-drag-resize :x =" 0" >
@@ -302,6 +299,8 @@ Required: `false`<br>
302299Default: ` 0 `
303300
304301Define the initial y position of the component.
302+ 定义组件的初始Y位置。
303+
305304
306305``` html
307306<vue-drag-resize :y =" 0" >
@@ -313,6 +312,7 @@ Required: `false`<br>
313312Default: ` auto `
314313
315314Define the zIndex of the component.
315+ 定义组件的zindex(层级)。
316316
317317``` html
318318<vue-drag-resize :z =" 999" >
@@ -335,6 +335,8 @@ Required: `false`<br>
335335Default: ` ['tl', 'tm', 'tr', 'mr', 'br', 'bm', 'bl', 'ml'] `
336336
337337Define the array of handles to restrict the element resizing:
338+ 定义句柄数组以限制元素大小调整:
339+
338340* ` tl ` - Top left
339341* ` tm ` - Top middle
340342* ` tr ` - Top right
@@ -354,6 +356,7 @@ Required: `false`<br>
354356Default: ` both `
355357
356358Define the axis on which the element is draggable. Available values are ` x ` , ` y ` , ` both ` or ` none ` .
359+ 定义元素可拖动的轴。 可用值为` x ` ,` y ` ,` both ` 或` none ` 。
357360
358361``` html
359362<vue-drag-resize axis =" x" >
@@ -364,6 +367,7 @@ Type: `String`<br>
364367Required: ` false `
365368
366369Defines the selector that should be used to drag the component.
370+ 定义应该用于拖动组件的选择器。
367371
368372``` html
369373<vue-drag-resize dragHandle =" .drag" >
@@ -374,6 +378,7 @@ Type: `String`<br>
374378Required: ` false `
375379
376380Defines a selector that should be used to prevent drag initialization.
381+ 定义应该用于防止拖动初始化的选择器。
377382
378383``` html
379384<vue-drag-resize dragCancel =" .drag" >
@@ -402,6 +407,7 @@ Required: `false`<br>
402407Parameters: ` Original event handler `
403408
404409Called whenever the component gets clicked.
410+ 单击组件时调用。
405411
406412``` html
407413<vue-drag-resize @clicked =" onActivated" >
@@ -413,6 +419,7 @@ Required: `false`<br>
413419Parameters: ` - `
414420
415421Called whenever the component gets clicked, in order to show handles.
422+ 单击组件时调用,以显示句柄。
416423
417424``` html
418425<vue-drag-resize @activated =" onActivated" >
@@ -424,6 +431,8 @@ Required: `false`<br>
424431Parameters: ` - `
425432
426433Called whenever the user clicks anywhere outside the component, in order to deactivate it.
434+ 每当用户单击组件外部的任何位置时调用,以便将其停用。
435+
427436
428437``` html
429438<vue-drag-resize @deactivated =" onDeactivated" >
@@ -433,6 +442,7 @@ Called whenever the user clicks anywhere outside the component, in order to deac
433442
434443Required: ` false ` <br >
435444Parameters: ` object `
445+
436446``` javascript
437447{
438448 left: Number , // the X position of the component
@@ -443,6 +453,8 @@ Parameters: `object`
443453```
444454
445455Called whenever the component gets resized.
456+ 每当组件调整大小时调用。
457+
446458
447459``` html
448460<vue-drag-resize @resizing =" onResizing" >
@@ -462,6 +474,8 @@ Parameters: `object`
462474```
463475
464476Called whenever the component stops getting resized.
477+ 每当组件停止调整大小时调用。
478+
465479
466480``` html
467481<vue-drag-resize @resizestop =" onResizstop" >
@@ -481,6 +495,8 @@ Parameters: `object`
481495```
482496
483497Called whenever the component gets dragged.
498+ 每当拖动组件时调用。
499+
484500
485501``` html
486502<vue-drag-resize @dragging =" onDragging" >
@@ -501,6 +517,8 @@ Parameters: `object`
501517
502518
503519Called whenever the component stops getting dragged.
520+ 每当组件停止拖动时调用。
521+
504522
505523``` html
506524<vue-drag-resize @dragstop =" onDragstop" >
0 commit comments