jbaysolutions/vue-grid-layout

Define resize array for the active handlers

Open

#513 opened on Dec 11, 2020

View on GitHub
 (1 comment) (0 reactions) (0 assignees)JavaScript (6,777 stars) (1,436 forks)batch import
enhancementhelp wanted

Description

Describe the solution you'd like

I want to resize by dragging the border, But I don’t seem to see this API.

Describe alternatives you've considered

Something like this：

Define resize array for the active handlers:

this.resizeActive = ['leftTop', 'leftBottom', 'rightTop', 'rightBottom', 'left', 'right', 'top', 'bottom']

usage:

<grid-layout
  :resize-active="resizeActive"
/>

Additional context as shown:

resize-active-border.png

Contributor guide

Tech stack
vuejavascript
Domain
frontend
Issue type
feature
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-2 days
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
Vue.js fundamentalsvue grid layout basics
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
70
Research direction
Explore the vue grid layout source code, particularly the GridLayout.vue component where props are defined and resizing behavior is implemented. Look for existing props like 'draggable' or 'resizable' and emulate the pattern to add a 'resizeActive' prop that accepts an array of handler positions. Also check the documentation to ensure the new prop is compatible with current API.