This repository has been archived on 2023-08-30. You can view files and clone it, but cannot push or open issues/pull-requests.
bytedo
/
wcui
Archived
1
0
Fork 0

tree组件增加多选开关;优化:attr指令逻辑

old
宇天 2018-01-01 01:20:51 +08:00
parent 65ac216f91
commit 7784e87511
2 changed files with 19 additions and 8 deletions

View File

@ -3723,16 +3723,22 @@
if (!W3C && propMap[k]) { if (!W3C && propMap[k]) {
k = propMap[k] k = propMap[k]
} }
if (obj[i] === false || obj[i] === null || obj[i] === undefined) {
obj[i] = ''
}
if (typeof elem[boolMap[k]] === 'boolean') { if (typeof elem[boolMap[k]] === 'boolean') {
//布尔属性必须使用el.xxx = true|false方式设值 //布尔属性必须使用el.xxx = true|false方式设值
elem[boolMap[k]] = !!obj[i] elem[boolMap[k]] = !!obj[i]
//如果为false, IE全系列下相当于setAttribute(xxx, ''),会影响到样式,需要进一步处理 //如果为false, IE全系列下相当于setAttribute(xxx, ''),会影响到样式,需要进一步处理
if (!obj[i]) obj[i] = !!obj[i] if (!obj[i]) {
obj[i] = !!obj[i]
} }
if (obj[i] === false || obj[i] === null || obj[i] === undefined) if (obj[i] === false) {
return elem.removeAttribute(k) return elem.removeAttribute(k)
}
}
//SVG只能使用setAttribute(xxx, yyy), VML只能使用elem.xxx = yyy ,HTML的固有属性必须elem.xxx = yyy //SVG只能使用setAttribute(xxx, yyy), VML只能使用elem.xxx = yyy ,HTML的固有属性必须elem.xxx = yyy
var isInnate = rsvg.test(elem) var isInnate = rsvg.test(elem)

View File

@ -44,6 +44,7 @@ export default Anot.component('tree', {
<em class="ui-font" :click="toggle(el)"></em> <em class="ui-font" :click="toggle(el)"></em>
<span <span
class="checkbox ui-font" class="checkbox ui-font"
:if="multiCheck"
:class="{checked: el.checked}" :class="{checked: el.checked}"
:click="onChecked(el)"></span> :click="onChecked(el)"></span>
<span <span
@ -53,13 +54,14 @@ export default Anot.component('tree', {
<template <template
name="tree" name="tree"
:attr="{ :attr="{
'multi-check': multiCheck,
list: el[props.children], list: el[props.children],
onSelected: props.onSelected, onSelected: props.onSelected,
onChecked: onChecked, onChecked: onChecked,
id: props.id, id: props.id,
label: props.label, label: props.label,
parent: props.parent, parent: props.parent,
children: props.children children: props.children,
}"></template> }"></template>
</li> </li>
</ul> </ul>
@ -72,8 +74,10 @@ export default Anot.component('tree', {
props.parent = props.parent || 'parent' props.parent = props.parent || 'parent'
props.children = props.children || 'children' props.children = props.children || 'children'
state.list = format(props.list || [], props) state.list = format(props.list || [], props)
state.multiCheck = !!props.multiCheck
delete props.list delete props.list
delete props.theme delete props.theme
delete props.multiCheck
}, },
componentDidMount: function() { componentDidMount: function() {
if (typeof this.props.onCreated === 'function') { if (typeof this.props.onCreated === 'function') {
@ -82,16 +86,17 @@ export default Anot.component('tree', {
}, },
state: { state: {
list: [], list: [],
multiCheck: false,
currItem: -1, currItem: -1,
checked: {} checked: {}
}, },
skip: ['checked'], skip: ['checked'],
props: { props: {
className: '', className: '',
id: 'id', id: '',
label: 'label', label: '',
parent: 'parent', parent: '',
children: 'children', children: '',
onCreated: Anot.PropsTypes.isFunction(), onCreated: Anot.PropsTypes.isFunction(),
onSelected: Anot.PropsTypes.isFunction(), onSelected: Anot.PropsTypes.isFunction(),
onChecked: Anot.PropsTypes.isFunction() onChecked: Anot.PropsTypes.isFunction()