Skip to content

Commit 8ebe114

Browse files
Merge pull request #499 from tomlankhorst/feature/header-slot
Add 'header' slot
2 parents f1ad3b2 + ef9e171 commit 8ebe114

File tree

4 files changed

+63
-6
lines changed

4 files changed

+63
-6
lines changed

dist/vuedraggable.js

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
'use strict';
22

3+
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
4+
35
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
46

57
function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
@@ -138,10 +140,15 @@ function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr
138140
}
139141
}
140142
var children = slots;
141-
var footer = this.$slots.footer;
143+
var _$slots = this.$slots,
144+
header = _$slots.header,
145+
footer = _$slots.footer;
142146

147+
if (header) {
148+
children = children ? [].concat(_toConsumableArray(header), _toConsumableArray(children)) : [].concat(_toConsumableArray(header));
149+
}
143150
if (footer) {
144-
children = slots ? [].concat(_toConsumableArray(slots), _toConsumableArray(footer)) : [].concat(_toConsumableArray(footer));
151+
children = children ? [].concat(_toConsumableArray(children), _toConsumableArray(footer)) : [].concat(_toConsumableArray(footer));
145152
}
146153
var attributes = null;
147154
var update = function update(name, value) {
@@ -393,7 +400,7 @@ function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr
393400
return draggableComponent;
394401
}
395402

396-
if (typeof exports == "object") {
403+
if ((typeof exports === 'undefined' ? 'undefined' : _typeof(exports)) == "object") {
397404
var Sortable = require("sortablejs");
398405
module.exports = buildDraggable(Sortable);
399406
} else if (typeof define == "function" && define.amd) {

dist/vuedraggable.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

examples/headerfooterslot.html

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
<!doctype html>
2+
<html class="no-js" lang="">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="x-ua-compatible" content="ie=edge">
6+
<title>Basic example</title>
7+
<meta name="description" content="">
8+
<meta name="viewport" content="width=device-width, initial-scale=1">
9+
10+
<link rel="stylesheet" href="css/main.css">
11+
</head>
12+
<body>
13+
14+
<div id="main">
15+
<h1>Vue Draggable</h1>
16+
17+
<div :class="dragging? 'list-dragging' : 'drag'">
18+
<h2>Draggable</h2>
19+
<draggable :list="list" @start="dragging=true" @end="dragging=false" :options="{draggable:'.itemd'}">
20+
<div v-for="element in list" class="itemd" :key="element.id">{{element.name}}</div>
21+
<button slot="header" @click="add">Add People (Header)</button>
22+
<button slot="footer" @click="add">Add People (Footer)</button>
23+
</draggable>
24+
</div>
25+
26+
<div class="normal">
27+
<h2>Normal v-for</h2>
28+
<div >
29+
<div v-for="element in list">{{element.name}}</div>
30+
</div>
31+
</div>
32+
33+
<button @click="replace">Replace</button>
34+
<br>
35+
36+
<a href="Two_Lists.html">See 2 lists example</a>
37+
<a href="Two_Lists_Clone.html">See clone element example</a>
38+
<a href="Two_Lists_Clone_If.html">See clone v-if element example</a>
39+
40+
</div>
41+
42+
<script type="text/javascript" src="libs\vue\dist\vue.js"></script>
43+
<script type="text/javascript" src="libs\Sortable\Sortable.js"></script>
44+
<script type="text/javascript" src="src\vuedraggable.js"></script>
45+
<script type="text/javascript" src="script\main.js"></script>
46+
</body>
47+
</html>

src/vuedraggable.js

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -115,9 +115,12 @@
115115
}
116116
}
117117
let children = slots
118-
const { footer } = this.$slots
118+
const { header, footer } = this.$slots
119+
if (header) {
120+
children = children ? [...header, ...children] : [...header];
121+
}
119122
if (footer) {
120-
children = slots ? [...slots, ...footer] : [...footer]
123+
children = children ? [...children, ...footer] : [...footer]
121124
}
122125
var attributes = null;
123126
const update = (name, value) => { attributes = buildAttribute(attributes, name, value); };

0 commit comments

Comments
 (0)