Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
leizi929
Sortable
提交
d779c391
S
Sortable
项目概览
leizi929
/
Sortable
与 Fork 源项目一致
从无法访问的项目Fork
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
S
Sortable
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
前往新版Gitcode,体验更适合开发者的 AI 搜索 >>
提交
d779c391
编写于
10月 07, 2015
作者:
S
Slavic Dragovtev
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
use tabs instead of spaces
上级
4ad06538
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
154 addition
and
154 deletion
+154
-154
react-sortable-mixin.js
react-sortable-mixin.js
+154
-154
未找到文件。
react-sortable-mixin.js
浏览文件 @
d779c391
...
...
@@ -4,160 +4,160 @@
*/
(
function
(
factory
)
{
'
use strict
'
;
if
(
typeof
module
!=
'
undefined
'
&&
typeof
module
.
exports
!=
'
undefined
'
)
{
module
.
exports
=
factory
(
require
(
'
./Sortable
'
));
}
else
if
(
typeof
define
===
'
function
'
&&
define
.
amd
)
{
define
([
'
./Sortable
'
],
factory
);
}
else
{
/* jshint sub:true */
window
[
'
SortableMixin
'
]
=
factory
(
Sortable
);
}
'
use strict
'
;
if
(
typeof
module
!=
'
undefined
'
&&
typeof
module
.
exports
!=
'
undefined
'
)
{
module
.
exports
=
factory
(
require
(
'
./Sortable
'
));
}
else
if
(
typeof
define
===
'
function
'
&&
define
.
amd
)
{
define
([
'
./Sortable
'
],
factory
);
}
else
{
/* jshint sub:true */
window
[
'
SortableMixin
'
]
=
factory
(
Sortable
);
}
})(
function
(
/** Sortable */
Sortable
)
{
'
use strict
'
;
'
use strict
'
;
var
_nextSibling
;
var
_activeComponent
;
var
_defaultOptions
=
{
ref
:
'
list
'
,
model
:
'
items
'
,
animation
:
100
,
onStart
:
'
handleStart
'
,
onEnd
:
'
handleEnd
'
,
onAdd
:
'
handleAdd
'
,
onUpdate
:
'
handleUpdate
'
,
onRemove
:
'
handleRemove
'
,
onSort
:
'
handleSort
'
,
onFilter
:
'
handleFilter
'
,
onMove
:
'
handleMove
'
};
function
_getModelName
(
component
)
{
return
component
.
sortableOptions
&&
component
.
sortableOptions
.
model
||
_defaultOptions
.
model
;
}
function
_getModelItems
(
component
)
{
var
name
=
_getModelName
(
component
),
items
=
component
.
state
&&
component
.
state
[
name
]
||
component
.
props
[
name
];
return
items
.
slice
();
}
function
_extend
(
dst
,
src
)
{
for
(
var
key
in
src
)
{
if
(
src
.
hasOwnProperty
(
key
))
{
dst
[
key
]
=
src
[
key
];
}
}
return
dst
;
}
/**
* Simple and easy mixin-wrapper for rubaxa/Sortable library, in order to
* make reorderable drag-and-drop lists on modern browsers and touch devices.
*
* @mixin
*/
var
SortableMixin
=
{
sortableMixinVersion
:
'
0.1.0
'
,
/**
* @type {Sortable}
* @private
*/
_sortableInstance
:
null
,
componentDidMount
:
function
()
{
var
DOMNode
,
options
=
_extend
(
_extend
({},
_defaultOptions
),
this
.
sortableOptions
||
{}),
copyOptions
=
_extend
({},
options
),
emitEvent
=
function
(
/** string */
type
,
/** Event */
evt
)
{
var
method
=
this
[
options
[
type
]];
method
&&
method
.
call
(
this
,
evt
,
this
.
_sortableInstance
);
}.
bind
(
this
);
// Bind callbacks so that "this" refers to the component
'
onStart onEnd onAdd onSort onUpdate onRemove onFilter onMove
'
.
split
(
'
'
).
forEach
(
function
(
/** string */
name
)
{
copyOptions
[
name
]
=
function
(
evt
)
{
if
(
name
===
'
onStart
'
)
{
_nextSibling
=
evt
.
item
.
nextElementSibling
;
_activeComponent
=
this
;
}
else
if
(
name
===
'
onAdd
'
||
name
===
'
onUpdate
'
)
{
evt
.
from
.
insertBefore
(
evt
.
item
,
_nextSibling
);
var
newState
=
{},
remoteState
=
{},
oldIndex
=
evt
.
oldIndex
,
newIndex
=
evt
.
newIndex
,
items
=
_getModelItems
(
this
),
remoteItems
,
item
;
if
(
name
===
'
onAdd
'
)
{
remoteItems
=
_getModelItems
(
_activeComponent
);
item
=
remoteItems
.
splice
(
oldIndex
,
1
)[
0
];
items
.
splice
(
newIndex
,
0
,
item
);
remoteState
[
_getModelName
(
_activeComponent
)]
=
remoteItems
;
}
else
{
items
.
splice
(
newIndex
,
0
,
items
.
splice
(
oldIndex
,
1
)[
0
]);
}
newState
[
_getModelName
(
this
)]
=
items
;
if
(
copyOptions
[
"
stateHandler
"
])
{
this
[
copyOptions
[
"
stateHandler
"
]](
newState
);
}
else
{
this
.
setState
(
newState
);
}
(
this
!==
_activeComponent
)
&&
_activeComponent
.
setState
(
remoteState
);
}
setTimeout
(
function
()
{
emitEvent
(
name
,
evt
);
},
0
);
}.
bind
(
this
);
},
this
);
DOMNode
=
this
.
getDOMNode
()
?
(
this
.
refs
[
options
.
ref
]
||
this
).
getDOMNode
()
:
this
.
refs
[
options
.
ref
]
||
this
;
/** @namespace this.refs — http://facebook.github.io/react/docs/more-about-refs.html */
this
.
_sortableInstance
=
Sortable
.
create
(
DOMNode
,
copyOptions
);
},
componentWillReceiveProps
:
function
(
nextProps
)
{
var
newState
=
{},
modelName
=
_getModelName
(
this
),
items
=
nextProps
[
modelName
];
if
(
items
)
{
newState
[
modelName
]
=
items
;
this
.
setState
(
newState
);
}
},
componentWillUnmount
:
function
()
{
this
.
_sortableInstance
.
destroy
();
this
.
_sortableInstance
=
null
;
}
};
// Export
return
SortableMixin
;
var
_nextSibling
;
var
_activeComponent
;
var
_defaultOptions
=
{
ref
:
'
list
'
,
model
:
'
items
'
,
animation
:
100
,
onStart
:
'
handleStart
'
,
onEnd
:
'
handleEnd
'
,
onAdd
:
'
handleAdd
'
,
onUpdate
:
'
handleUpdate
'
,
onRemove
:
'
handleRemove
'
,
onSort
:
'
handleSort
'
,
onFilter
:
'
handleFilter
'
,
onMove
:
'
handleMove
'
};
function
_getModelName
(
component
)
{
return
component
.
sortableOptions
&&
component
.
sortableOptions
.
model
||
_defaultOptions
.
model
;
}
function
_getModelItems
(
component
)
{
var
name
=
_getModelName
(
component
),
items
=
component
.
state
&&
component
.
state
[
name
]
||
component
.
props
[
name
];
return
items
.
slice
();
}
function
_extend
(
dst
,
src
)
{
for
(
var
key
in
src
)
{
if
(
src
.
hasOwnProperty
(
key
))
{
dst
[
key
]
=
src
[
key
];
}
}
return
dst
;
}
/**
* Simple and easy mixin-wrapper for rubaxa/Sortable library, in order to
* make reorderable drag-and-drop lists on modern browsers and touch devices.
*
* @mixin
*/
var
SortableMixin
=
{
sortableMixinVersion
:
'
0.1.0
'
,
/**
* @type {Sortable}
* @private
*/
_sortableInstance
:
null
,
componentDidMount
:
function
()
{
var
DOMNode
,
options
=
_extend
(
_extend
({},
_defaultOptions
),
this
.
sortableOptions
||
{}),
copyOptions
=
_extend
({},
options
),
emitEvent
=
function
(
/** string */
type
,
/** Event */
evt
)
{
var
method
=
this
[
options
[
type
]];
method
&&
method
.
call
(
this
,
evt
,
this
.
_sortableInstance
);
}.
bind
(
this
);
// Bind callbacks so that "this" refers to the component
'
onStart onEnd onAdd onSort onUpdate onRemove onFilter onMove
'
.
split
(
'
'
).
forEach
(
function
(
/** string */
name
)
{
copyOptions
[
name
]
=
function
(
evt
)
{
if
(
name
===
'
onStart
'
)
{
_nextSibling
=
evt
.
item
.
nextElementSibling
;
_activeComponent
=
this
;
}
else
if
(
name
===
'
onAdd
'
||
name
===
'
onUpdate
'
)
{
evt
.
from
.
insertBefore
(
evt
.
item
,
_nextSibling
);
var
newState
=
{},
remoteState
=
{},
oldIndex
=
evt
.
oldIndex
,
newIndex
=
evt
.
newIndex
,
items
=
_getModelItems
(
this
),
remoteItems
,
item
;
if
(
name
===
'
onAdd
'
)
{
remoteItems
=
_getModelItems
(
_activeComponent
);
item
=
remoteItems
.
splice
(
oldIndex
,
1
)[
0
];
items
.
splice
(
newIndex
,
0
,
item
);
remoteState
[
_getModelName
(
_activeComponent
)]
=
remoteItems
;
}
else
{
items
.
splice
(
newIndex
,
0
,
items
.
splice
(
oldIndex
,
1
)[
0
]);
}
newState
[
_getModelName
(
this
)]
=
items
;
if
(
copyOptions
[
"
stateHandler
"
])
{
this
[
copyOptions
[
"
stateHandler
"
]](
newState
);
}
else
{
this
.
setState
(
newState
);
}
(
this
!==
_activeComponent
)
&&
_activeComponent
.
setState
(
remoteState
);
}
setTimeout
(
function
()
{
emitEvent
(
name
,
evt
);
},
0
);
}.
bind
(
this
);
},
this
);
DOMNode
=
this
.
getDOMNode
()
?
(
this
.
refs
[
options
.
ref
]
||
this
).
getDOMNode
()
:
this
.
refs
[
options
.
ref
]
||
this
;
/** @namespace this.refs — http://facebook.github.io/react/docs/more-about-refs.html */
this
.
_sortableInstance
=
Sortable
.
create
(
DOMNode
,
copyOptions
);
},
componentWillReceiveProps
:
function
(
nextProps
)
{
var
newState
=
{},
modelName
=
_getModelName
(
this
),
items
=
nextProps
[
modelName
];
if
(
items
)
{
newState
[
modelName
]
=
items
;
this
.
setState
(
newState
);
}
},
componentWillUnmount
:
function
()
{
this
.
_sortableInstance
.
destroy
();
this
.
_sortableInstance
=
null
;
}
};
// Export
return
SortableMixin
;
});
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录