Skip to content

Commit

Permalink
fix: Add children of slot-panel to render list
Browse files Browse the repository at this point in the history
  • Loading branch information
wangyi7099 committed Jul 7, 2018
1 parent 600dc7b commit df417ae
Show file tree
Hide file tree
Showing 7 changed files with 93 additions and 58 deletions.
78 changes: 48 additions & 30 deletions dist/vuescroll.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,10 @@
*/

(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('vue')) :
typeof define === 'function' && define.amd ? define(['vue'], factory) :
(global.vuescroll = factory(global.Vue));
}(this, (function (Vue) { 'use strict';
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('vue'), require('util')) :
typeof define === 'function' && define.amd ? define(['vue', 'util'], factory) :
(global.vuescroll = factory(global.Vue,global.util));
}(this, (function (Vue,util) { 'use strict';

Vue = Vue && Vue.hasOwnProperty('default') ? Vue['default'] : Vue;

Expand Down Expand Up @@ -163,23 +163,14 @@ function isIE() /* istanbul ignore next */{

function insertChildrenIntoSlot(h, parentVnode, childVNode, data) {
parentVnode = parentVnode[0] ? parentVnode[0] : parentVnode;
var tag = parentVnode.componentOptions && parentVnode.componentOptions.tag || parentVnode.tag;
// if (!Array.isArray(childVNode)) {
// childVNode = [childVNode];
// }

// // Remove null node
// for (let index = 0; index < childVNode.length; index++) {
// const element = childVNode[index];
// if (!element) {
// childVNode.splice(index, 1);
// index--;
// }
// }

var isComponent = !!parentVnode.componentOptions;

var tag = isComponent ? parentVnode.componentOptions.tag : parentVnode.tag;

var _data = parentVnode.componentOptions || parentVnode.data || {};

// If component, use `nativeOn` intead.
if (parentVnode.componentOptions) {
if (isComponent) {
data.nativeOn = data.on;
_data.props = _data.propsData;

Expand Down Expand Up @@ -2721,12 +2712,12 @@ var api = {
this.refreshInternalStatus();
},

// Get your scroll times!
// Get the times you have scrolled!
getScrollingTimes: function getScrollingTimes() {
return this.vuescroll.state.scrollingTimes;
},

// Clear your scroll times!
// Clear the times you have scrolled!
clearScrollingTimes: function clearScrollingTimes() {
this.vuescroll.state.scrollingTimes = 0;
}
Expand Down Expand Up @@ -3384,10 +3375,12 @@ var scrollContent = {
ref: 'scrollContent',
class: '__view'
};
var customContent = parent.$slots['scroll-content'];
if (customContent) {
return insertChildrenIntoSlot(h, customContent, slots().default, propsData);

var _customContent = parent.$slots['scroll-content'];
if (_customContent) {
return insertChildrenIntoSlot(h, _customContent, slots().default, propsData);
}

return h(
'div',
propsData,
Expand Down Expand Up @@ -3453,11 +3446,14 @@ var scrollPanel = {
var data = {
class: ['__panel']
};

var parent = getRealParent(this);
var customPanel = parent.$slots['scroll-panel'];
if (customPanel) {
return insertChildrenIntoSlot(h, customPanel, this.$slots.default, data);

var _customPanel = parent.$slots['scroll-panel'];
if (_customPanel) {
return insertChildrenIntoSlot(h, _customPanel, this.$slots.default, data);
}

return h(
'div',
data,
Expand Down Expand Up @@ -3555,6 +3551,24 @@ function createPanelChildren(vm, h) {
return [createContent(h, vm)];
} else if (vm.mode == 'slide') {
var renderChildren = [vm.$slots.default];

/**
* Keep the children-rendered-order in case of the style crash
* when push-load or pull-refresh is enable
*/
var _customPanel = vm.$slots['scroll-panel'];
if (_customPanel) {
if (_customPanel.length > 0) {
renderChildren = _customPanel.concat(renderChildren);
} else {
_customPanel = _customPanel[0];
var ch = _customPanel.children;
if (util.isArray(ch)) {
renderChildren = ch.concat(renderChildren);
}
}
}

// handle refresh
if (vm.mergedOptions.vuescroll.pullRefresh.enable) {
var refreshDom = null;
Expand All @@ -3565,6 +3579,7 @@ function createPanelChildren(vm, h) {
[[refreshDom, vm.pullRefreshTip]]
));
}

// handle load
if (vm.mergedOptions.vuescroll.pushLoad.enable) {
var loadDom = null;
Expand Down Expand Up @@ -3878,12 +3893,15 @@ var vueScrollCore = {
}
};
}
var customContainer = this.$slots['scroll-container'];

var _customContainer = this.$slots['scroll-container'];

var ch = [createPanel(h, vm), createBar(h, vm, 'vertical'), createBar(h, vm, 'horizontal')];

if (customContainer) {
return insertChildrenIntoSlot(h, customContainer, ch, vuescrollData);
if (_customContainer) {
return insertChildrenIntoSlot(h, _customContainer, ch, vuescrollData);
}

return h(
'div',
vuescrollData,
Expand Down
2 changes: 1 addition & 1 deletion dist/vuescroll.min.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/vuescroll.min.js.map

Large diffs are not rendered by default.

8 changes: 5 additions & 3 deletions src/components/child-components/vuescroll-content.js
Original file line number Diff line number Diff line change
Expand Up @@ -39,15 +39,17 @@ export default {
ref: 'scrollContent',
class: '__view'
};
const customContent = parent.$slots['scroll-content'];
if (customContent) {

const _customContent = parent.$slots['scroll-content'];
if (_customContent) {
return insertChildrenIntoSlot(
h,
customContent,
_customContent,
slots().default,
propsData
);
}

return <div {...propsData}>{slots().default}</div>;
}
};
Expand Down
29 changes: 26 additions & 3 deletions src/components/child-components/vuescroll-panel.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import {
getRealParent
} from '../../util';
import { createContent } from './vuescroll-content';
import { isArray } from 'util';
// vueScrollPanel
export default {
name: 'scrollPanel',
Expand Down Expand Up @@ -41,11 +42,14 @@ export default {
let data = {
class: ['__panel']
};

const parent = getRealParent(this);
const customPanel = parent.$slots['scroll-panel'];
if (customPanel) {
return insertChildrenIntoSlot(h, customPanel, this.$slots.default, data);

const _customPanel = parent.$slots['scroll-panel'];
if (_customPanel) {
return insertChildrenIntoSlot(h, _customPanel, this.$slots.default, data);
}

return <div {...data}>{[this.$slots.default]}</div>;
}
};
Expand Down Expand Up @@ -141,6 +145,24 @@ function createPanelChildren(vm, h) {
return [createContent(h, vm)];
} else if (vm.mode == 'slide') {
let renderChildren = [vm.$slots.default];

/**
* Keep the children-rendered-order in case of the style crash
* when push-load or pull-refresh is enable
*/
let _customPanel = vm.$slots['scroll-panel'];
if (_customPanel) {
if (_customPanel.length > 0) {
renderChildren = _customPanel.concat(renderChildren);
} else {
_customPanel = _customPanel[0];
const ch = _customPanel.children;
if (isArray(ch)) {
renderChildren = ch.concat(renderChildren);
}
}
}

// handle refresh
if (vm.mergedOptions.vuescroll.pullRefresh.enable) {
let refreshDom = null;
Expand All @@ -151,6 +173,7 @@ function createPanelChildren(vm, h) {
</div>
);
}

// handle load
if (vm.mergedOptions.vuescroll.pushLoad.enable) {
let loadDom = null;
Expand Down
9 changes: 6 additions & 3 deletions src/components/vuescroll.js
Original file line number Diff line number Diff line change
Expand Up @@ -214,16 +214,19 @@ const vueScrollCore = {
}
};
}
const customContainer = this.$slots['scroll-container'];

const _customContainer = this.$slots['scroll-container'];

const ch = [
createPanel(h, vm),
createBar(h, vm, 'vertical'),
createBar(h, vm, 'horizontal')
];

if (customContainer) {
return insertChildrenIntoSlot(h, customContainer, ch, vuescrollData);
if (_customContainer) {
return insertChildrenIntoSlot(h, _customContainer, ch, vuescrollData);
}

return <div {...vuescrollData}>{ch}</div>;
}
};
Expand Down
23 changes: 6 additions & 17 deletions src/util/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -169,25 +169,14 @@ export function isIE() /* istanbul ignore next */ {

export function insertChildrenIntoSlot(h, parentVnode, childVNode, data) {
parentVnode = parentVnode[0] ? parentVnode[0] : parentVnode;
const tag =
(parentVnode.componentOptions && parentVnode.componentOptions.tag) ||
parentVnode.tag;
// if (!Array.isArray(childVNode)) {
// childVNode = [childVNode];
// }

// // Remove null node
// for (let index = 0; index < childVNode.length; index++) {
// const element = childVNode[index];
// if (!element) {
// childVNode.splice(index, 1);
// index--;
// }
// }

const isComponent = !!parentVnode.componentOptions;

const tag = isComponent ? parentVnode.componentOptions.tag : parentVnode.tag;

const _data = parentVnode.componentOptions || parentVnode.data || {};

// If component, use `nativeOn` intead.
if (parentVnode.componentOptions) {
if (isComponent) {
data.nativeOn = data.on;
_data.props = _data.propsData;

Expand Down

0 comments on commit df417ae

Please # to comment.