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
Code Issues Pull Requests Wiki Activity

修复watch数组回调执行时数据未改变的bug;移除$fire的component!指令;修复vm的$up,$children,$components属性;优化组件的几个特殊指令;

old
宇天 2018-07-19 13:30:47 +08:00
parent c31c7cebba
commit 4e8516ffcd
8 changed files with 281 additions and 166 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

87
src/js/anot-touch.js
View File

@ -1724,8 +1724,10 @@ const _Anot = (function() {
hideProperty($vmodel, '$active', false) hideProperty($vmodel, '$active', false)
hideProperty($vmodel, '$pathname', old ? old.$pathname : '') hideProperty($vmodel, '$pathname', old ? old.$pathname : '')
hideProperty($vmodel, '$accessors', accessors) hideProperty($vmodel, '$accessors', accessors)
hideProperty($vmodel, '$events', {})
hideProperty($vmodel, '$refs', {}) hideProperty($vmodel, '$refs', {})
hideProperty($vmodel, '$children', []) hideProperty($vmodel, '$children', [])
hideProperty($vmodel, '$components', [])
hideProperty($vmodel, 'hasOwnProperty', trackBy) hideProperty($vmodel, 'hasOwnProperty', trackBy)
hideProperty($vmodel, '$mounted', mounted) hideProperty($vmodel, '$mounted', mounted)
if (options.watch) { if (options.watch) {
@ -1745,16 +1747,6 @@ const _Anot = (function() {
var v = $vmodel.$children[i] var v = $vmodel.$children[i]
v.$fire && v.$fire.apply(v, [ee, a]) v.$fire && v.$fire.apply(v, [ee, a])
} }
// component! 这是一个特殊的标识,可以直接修改子组件的state值
// 且只针对指定子组件有效
} else if (path.indexOf('component!') === 0) {
var ee = path.slice(10).split('!')
for (var i in $vmodel.$children) {
if ($vmodel.$children[i].$id === ee[0]) {
$vmodel.$children[i][ee[1]] = a
break
}
}
} else { } else {
$emit.call($vmodel, path, [a]) $emit.call($vmodel, path, [a])
} }
@ -1987,8 +1979,9 @@ const _Anot = (function() {
throw Error(index + 'set方法的第一个参数不能大于原数组长度') throw Error(index + 'set方法的第一个参数不能大于原数组长度')
} }
if (this[index] !== val) { if (this[index] !== val) {
$emit.call(this.$up, this.$pathname + '.*', [val, this[index]]) var old = this[index]
this.splice(index, 1, val) this.splice(index, 1, val)
$emit.call(this.$up, this.$pathname + '.*', [val, old, null, index])
} }
}, },
contains: function(el) { contains: function(el) {
@ -3545,11 +3538,11 @@ const _Anot = (function() {
} }
} }
function scanTag(elem, vmodels, node) { function scanTag(elem, vmodels) {
//扫描顺序 skip(0) --> anot(1) --> :if(10) --> :repeat(90) //扫描顺序 skip(0) --> anot(1) --> :if(10) --> :repeat(90)
//--> :if-loop(110) --> :attr(970) ...--> :duplex(2000)垫后 //--> :if-loop(110) --> :attr(970) ...--> :duplex(2000)垫后
var skip = elem.getAttribute('skip') var skip = elem.getAttribute('skip')
node = elem.getAttributeNode('anot') var node = elem.getAttributeNode('anot')
var vm = vmodels.concat() var vm = vmodels.concat()
if (typeof skip === 'string') { if (typeof skip === 'string') {
return return
@ -3566,7 +3559,10 @@ const _Anot = (function() {
elem.removeAttribute(node.name) //removeAttributeNode不会刷新xx[anot]样式规则 elem.removeAttribute(node.name) //removeAttributeNode不会刷新xx[anot]样式规则
createSignalTower(elem, newVmodel) createSignalTower(elem, newVmodel)
hideProperty(newVmodel, '$elem', elem) hideProperty(newVmodel, '$elem', elem)
if (vmodels.length) { if (vmodels.length) {
newVmodel.$up = vmodels[0]
vmodels[0].$children.push(newVmodel)
var props = {} var props = {}
attrs.forEach(function(attr) { attrs.forEach(function(attr) {
if (/^:/.test(attr.name)) { if (/^:/.test(attr.name)) {
@ -3787,7 +3783,13 @@ const _Anot = (function() {
function parseVmValue(vm, key, val) { function parseVmValue(vm, key, val) {
if (arguments.length === 2) { if (arguments.length === 2) {
return Function('o', 'return o.' + key)(vm) var oval = Function('o', 'return o.' + key)(vm)
if (oval && typeof oval === 'object') {
try {
return oval.$model
} catch (err) {}
}
return oval
} else if (arguments.length === 3) { } else if (arguments.length === 3) {
Function('o', 'v', 'return o.' + key + ' = v')(vm, val) Function('o', 'v', 'return o.' + key + ' = v')(vm, val)
} }
@ -3852,7 +3854,7 @@ const _Anot = (function() {
if (disabledKeyReverse) { if (disabledKeyReverse) {
val = !val val = !val
} }
parentVm.$fire('component!' + $id + '!disabled', val) Anot.vmodels[$id].disabled = val
}) })
delete props[':disabled'] delete props[':disabled']
@ -3872,7 +3874,7 @@ const _Anot = (function() {
if (loadingKeyReverse) { if (loadingKeyReverse) {
val = !val val = !val
} }
parentVm.$fire('component!' + $id + '!loading', val) Anot.vmodels[$id].loading = val
}) })
delete props[':loading'] delete props[':loading']
} }
@ -3880,22 +3882,43 @@ const _Anot = (function() {
// :value可实现双向同步值 // :value可实现双向同步值
if (props.hasOwnProperty(':value')) { if (props.hasOwnProperty(':value')) {
var valueKey = props[':value'] var valueKey = props[':value']
var valueWatcher = function() {
var val = parseVmValue(parentVm, valueKey)
Anot.vmodels[$id].value = val
}
var childValueWatcher = function() {
var val = this.value
if (val && typeof val === 'object') {
val = val.$model || val
}
parseVmValue(parentVm, valueKey, val)
}
state.value = parseVmValue(parentVm, valueKey) state.value = parseVmValue(parentVm, valueKey)
parentVm.$watch(valueKey, function(val) {
parentVm.$fire('component!' + $id + '!value', val) parentVm.$watch(valueKey, valueWatcher)
}) parentVm.$watch(valueKey + '.*', valueWatcher)
if (Array.isArray(state.value)) { parentVm.$watch(valueKey + '.length', valueWatcher)
hooks.watch['value.length'] = hooks.watch['value.length']
? [hooks.watch['value.length']] if (hooks.watch.value) {
: [] hooks.watch.value = [hooks.watch.value]
hooks.watch['value.length'].push(function(val) {
parseVmValue(parentVm, valueKey, this.value.$model)
})
} else { } else {
hooks.watch.value = hooks.watch.value ? [hooks.watch.value] : [] hooks.watch.value = []
hooks.watch.value.push(function(val) { }
parseVmValue(parentVm, valueKey, val) if (hooks.watch['value.length']) {
}) hooks.watch['value.length'] = [hooks.watch['value.length']]
} else {
hooks.watch['value.length'] = []
}
if (hooks.watch['value.*']) {
hooks.watch['value.*'] = [hooks.watch['value.*']]
} else {
hooks.watch['value.*'] = []
}
if (Array.isArray(state.value)) {
hooks.watch['value.*'].push(childValueWatcher)
hooks.watch['value.length'].push(childValueWatcher)
} else {
hooks.watch.value.push(childValueWatcher)
} }
delete props[':value'] delete props[':value']
@ -3952,7 +3975,7 @@ const _Anot = (function() {
var vmodel = Anot(hooks) var vmodel = Anot(hooks)
delete vmodel.$mounted delete vmodel.$mounted
parentVm.$children.push(vmodel) parentVm.$components.push(vmodel)
elem.msResolved = 1 //防止二进扫描此元素 elem.msResolved = 1 //防止二进扫描此元素
@ -3991,7 +4014,7 @@ const _Anot = (function() {
if (ev.childReady) { if (ev.childReady) {
dependencies += ev.childReady dependencies += ev.childReady
if (vmodel !== ev.vm) { if (vmodel !== ev.vm) {
vmodel.$children.push(ev.vm) vmodel.$components.push(ev.vm)
ev.vm.$up = vmodel ev.vm.$up = vmodel
if (ev.childReady === -1) { if (ev.childReady === -1) {
children++ children++

87
src/js/anot-touch.shim.js
View File

@ -1739,8 +1739,10 @@
hideProperty($vmodel, '$active', false) hideProperty($vmodel, '$active', false)
hideProperty($vmodel, '$pathname', old ? old.$pathname : '') hideProperty($vmodel, '$pathname', old ? old.$pathname : '')
hideProperty($vmodel, '$accessors', accessors) hideProperty($vmodel, '$accessors', accessors)
hideProperty($vmodel, '$events', {})
hideProperty($vmodel, '$refs', {}) hideProperty($vmodel, '$refs', {})
hideProperty($vmodel, '$children', []) hideProperty($vmodel, '$children', [])
hideProperty($vmodel, '$components', [])
hideProperty($vmodel, 'hasOwnProperty', trackBy) hideProperty($vmodel, 'hasOwnProperty', trackBy)
hideProperty($vmodel, '$mounted', mounted) hideProperty($vmodel, '$mounted', mounted)
if (options.watch) { if (options.watch) {
@ -1760,16 +1762,6 @@
var v = $vmodel.$children[i] var v = $vmodel.$children[i]
v.$fire && v.$fire.apply(v, [ee, a]) v.$fire && v.$fire.apply(v, [ee, a])
} }
// component! 这是一个特殊的标识,可以直接修改子组件的state值
// 且只针对指定子组件有效
} else if (path.indexOf('component!') === 0) {
var ee = path.slice(10).split('!')
for (var i in $vmodel.$children) {
if ($vmodel.$children[i].$id === ee[0]) {
$vmodel.$children[i][ee[1]] = a
break
}
}
} else { } else {
$emit.call($vmodel, path, [a]) $emit.call($vmodel, path, [a])
} }
@ -2002,8 +1994,9 @@
throw Error(index + 'set方法的第一个参数不能大于原数组长度') throw Error(index + 'set方法的第一个参数不能大于原数组长度')
} }
if (this[index] !== val) { if (this[index] !== val) {
$emit.call(this.$up, this.$pathname + '.*', [val, this[index]]) var old = this[index]
this.splice(index, 1, val) this.splice(index, 1, val)
$emit.call(this.$up, this.$pathname + '.*', [val, old, null, index])
} }
}, },
contains: function(el) { contains: function(el) {
@ -3560,11 +3553,11 @@
} }
} }
function scanTag(elem, vmodels, node) { function scanTag(elem, vmodels) {
//扫描顺序 skip(0) --> anot(1) --> :if(10) --> :repeat(90) //扫描顺序 skip(0) --> anot(1) --> :if(10) --> :repeat(90)
//--> :if-loop(110) --> :attr(970) ...--> :duplex(2000)垫后 //--> :if-loop(110) --> :attr(970) ...--> :duplex(2000)垫后
var skip = elem.getAttribute('skip') var skip = elem.getAttribute('skip')
node = elem.getAttributeNode('anot') var node = elem.getAttributeNode('anot')
var vm = vmodels.concat() var vm = vmodels.concat()
if (typeof skip === 'string') { if (typeof skip === 'string') {
return return
@ -3581,7 +3574,10 @@
elem.removeAttribute(node.name) //removeAttributeNode不会刷新xx[anot]样式规则 elem.removeAttribute(node.name) //removeAttributeNode不会刷新xx[anot]样式规则
createSignalTower(elem, newVmodel) createSignalTower(elem, newVmodel)
hideProperty(newVmodel, '$elem', elem) hideProperty(newVmodel, '$elem', elem)
if (vmodels.length) { if (vmodels.length) {
newVmodel.$up = vmodels[0]
vmodels[0].$children.push(newVmodel)
var props = {} var props = {}
attrs.forEach(function(attr) { attrs.forEach(function(attr) {
if (/^:/.test(attr.name)) { if (/^:/.test(attr.name)) {
@ -3802,7 +3798,13 @@
function parseVmValue(vm, key, val) { function parseVmValue(vm, key, val) {
if (arguments.length === 2) { if (arguments.length === 2) {
return Function('o', 'return o.' + key)(vm) var oval = Function('o', 'return o.' + key)(vm)
if (oval && typeof oval === 'object') {
try {
return oval.$model
} catch (err) {}
}
return oval
} else if (arguments.length === 3) { } else if (arguments.length === 3) {
Function('o', 'v', 'return o.' + key + ' = v')(vm, val) Function('o', 'v', 'return o.' + key + ' = v')(vm, val)
} }
@ -3867,7 +3869,7 @@
if (disabledKeyReverse) { if (disabledKeyReverse) {
val = !val val = !val
} }
parentVm.$fire('component!' + $id + '!disabled', val) Anot.vmodels[$id].disabled = val
}) })
delete props[':disabled'] delete props[':disabled']
@ -3887,7 +3889,7 @@
if (loadingKeyReverse) { if (loadingKeyReverse) {
val = !val val = !val
} }
parentVm.$fire('component!' + $id + '!loading', val) Anot.vmodels[$id].loading = val
}) })
delete props[':loading'] delete props[':loading']
} }
@ -3895,22 +3897,43 @@
// :value可实现双向同步值 // :value可实现双向同步值
if (props.hasOwnProperty(':value')) { if (props.hasOwnProperty(':value')) {
var valueKey = props[':value'] var valueKey = props[':value']
var valueWatcher = function() {
var val = parseVmValue(parentVm, valueKey)
Anot.vmodels[$id].value = val
}
var childValueWatcher = function() {
var val = this.value
if (val && typeof val === 'object') {
val = val.$model || val
}
parseVmValue(parentVm, valueKey, val)
}
state.value = parseVmValue(parentVm, valueKey) state.value = parseVmValue(parentVm, valueKey)
parentVm.$watch(valueKey, function(val) {
parentVm.$fire('component!' + $id + '!value', val) parentVm.$watch(valueKey, valueWatcher)
}) parentVm.$watch(valueKey + '.*', valueWatcher)
if (Array.isArray(state.value)) { parentVm.$watch(valueKey + '.length', valueWatcher)
hooks.watch['value.length'] = hooks.watch['value.length']
? [hooks.watch['value.length']] if (hooks.watch.value) {
: [] hooks.watch.value = [hooks.watch.value]
hooks.watch['value.length'].push(function(val) {
parseVmValue(parentVm, valueKey, this.value.$model)
})
} else { } else {
hooks.watch.value = hooks.watch.value ? [hooks.watch.value] : [] hooks.watch.value = []
hooks.watch.value.push(function(val) { }
parseVmValue(parentVm, valueKey, val) if (hooks.watch['value.length']) {
}) hooks.watch['value.length'] = [hooks.watch['value.length']]
} else {
hooks.watch['value.length'] = []
}
if (hooks.watch['value.*']) {
hooks.watch['value.*'] = [hooks.watch['value.*']]
} else {
hooks.watch['value.*'] = []
}
if (Array.isArray(state.value)) {
hooks.watch['value.*'].push(childValueWatcher)
hooks.watch['value.length'].push(childValueWatcher)
} else {
hooks.watch.value.push(childValueWatcher)
} }
delete props[':value'] delete props[':value']
@ -3967,7 +3990,7 @@
var vmodel = Anot(hooks) var vmodel = Anot(hooks)
delete vmodel.$mounted delete vmodel.$mounted
parentVm.$children.push(vmodel) parentVm.$components.push(vmodel)
elem.msResolved = 1 //防止二进扫描此元素 elem.msResolved = 1 //防止二进扫描此元素
@ -4006,7 +4029,7 @@
if (ev.childReady) { if (ev.childReady) {
dependencies += ev.childReady dependencies += ev.childReady
if (vmodel !== ev.vm) { if (vmodel !== ev.vm) {
vmodel.$children.push(ev.vm) vmodel.$components.push(ev.vm)
ev.vm.$up = vmodel ev.vm.$up = vmodel
if (ev.childReady === -1) { if (ev.childReady === -1) {
children++ children++

87
src/js/anot.js
View File

@ -1724,8 +1724,10 @@ const _Anot = (function() {
hideProperty($vmodel, '$active', false) hideProperty($vmodel, '$active', false)
hideProperty($vmodel, '$pathname', old ? old.$pathname : '') hideProperty($vmodel, '$pathname', old ? old.$pathname : '')
hideProperty($vmodel, '$accessors', accessors) hideProperty($vmodel, '$accessors', accessors)
hideProperty($vmodel, '$events', {})
hideProperty($vmodel, '$refs', {}) hideProperty($vmodel, '$refs', {})
hideProperty($vmodel, '$children', []) hideProperty($vmodel, '$children', [])
hideProperty($vmodel, '$components', [])
hideProperty($vmodel, 'hasOwnProperty', trackBy) hideProperty($vmodel, 'hasOwnProperty', trackBy)
hideProperty($vmodel, '$mounted', mounted) hideProperty($vmodel, '$mounted', mounted)
if (options.watch) { if (options.watch) {
@ -1745,16 +1747,6 @@ const _Anot = (function() {
var v = $vmodel.$children[i] var v = $vmodel.$children[i]
v.$fire && v.$fire.apply(v, [ee, a]) v.$fire && v.$fire.apply(v, [ee, a])
} }
// component! 这是一个特殊的标识,可以直接修改子组件的state值
// 且只针对指定子组件有效
} else if (path.indexOf('component!') === 0) {
var ee = path.slice(10).split('!')
for (var i in $vmodel.$children) {
if ($vmodel.$children[i].$id === ee[0]) {
$vmodel.$children[i][ee[1]] = a
break
}
}
} else { } else {
$emit.call($vmodel, path, [a]) $emit.call($vmodel, path, [a])
} }
@ -1987,8 +1979,9 @@ const _Anot = (function() {
throw Error(index + 'set方法的第一个参数不能大于原数组长度') throw Error(index + 'set方法的第一个参数不能大于原数组长度')
} }
if (this[index] !== val) { if (this[index] !== val) {
$emit.call(this.$up, this.$pathname + '.*', [val, this[index]]) var old = this[index]
this.splice(index, 1, val) this.splice(index, 1, val)
$emit.call(this.$up, this.$pathname + '.*', [val, old, null, index])
} }
}, },
contains: function(el) { contains: function(el) {
@ -3545,11 +3538,11 @@ const _Anot = (function() {
} }
} }
function scanTag(elem, vmodels, node) { function scanTag(elem, vmodels) {
//扫描顺序 skip(0) --> anot(1) --> :if(10) --> :repeat(90) //扫描顺序 skip(0) --> anot(1) --> :if(10) --> :repeat(90)
//--> :if-loop(110) --> :attr(970) ...--> :duplex(2000)垫后 //--> :if-loop(110) --> :attr(970) ...--> :duplex(2000)垫后
var skip = elem.getAttribute('skip') var skip = elem.getAttribute('skip')
node = elem.getAttributeNode('anot') var node = elem.getAttributeNode('anot')
var vm = vmodels.concat() var vm = vmodels.concat()
if (typeof skip === 'string') { if (typeof skip === 'string') {
return return
@ -3566,7 +3559,10 @@ const _Anot = (function() {
elem.removeAttribute(node.name) //removeAttributeNode不会刷新xx[anot]样式规则 elem.removeAttribute(node.name) //removeAttributeNode不会刷新xx[anot]样式规则
createSignalTower(elem, newVmodel) createSignalTower(elem, newVmodel)
hideProperty(newVmodel, '$elem', elem) hideProperty(newVmodel, '$elem', elem)
if (vmodels.length) { if (vmodels.length) {
newVmodel.$up = vmodels[0]
vmodels[0].$children.push(newVmodel)
var props = {} var props = {}
attrs.forEach(function(attr) { attrs.forEach(function(attr) {
if (/^:/.test(attr.name)) { if (/^:/.test(attr.name)) {
@ -3787,7 +3783,13 @@ const _Anot = (function() {
function parseVmValue(vm, key, val) { function parseVmValue(vm, key, val) {
if (arguments.length === 2) { if (arguments.length === 2) {
return Function('o', 'return o.' + key)(vm) var oval = Function('o', 'return o.' + key)(vm)
if (oval && typeof oval === 'object') {
try {
return oval.$model
} catch (err) {}
}
return oval
} else if (arguments.length === 3) { } else if (arguments.length === 3) {
Function('o', 'v', 'return o.' + key + ' = v')(vm, val) Function('o', 'v', 'return o.' + key + ' = v')(vm, val)
} }
@ -3852,7 +3854,7 @@ const _Anot = (function() {
if (disabledKeyReverse) { if (disabledKeyReverse) {
val = !val val = !val
} }
parentVm.$fire('component!' + $id + '!disabled', val) Anot.vmodels[$id].disabled = val
}) })
delete props[':disabled'] delete props[':disabled']
@ -3872,7 +3874,7 @@ const _Anot = (function() {
if (loadingKeyReverse) { if (loadingKeyReverse) {
val = !val val = !val
} }
parentVm.$fire('component!' + $id + '!loading', val) Anot.vmodels[$id].loading = val
}) })
delete props[':loading'] delete props[':loading']
} }
@ -3880,22 +3882,43 @@ const _Anot = (function() {
// :value可实现双向同步值 // :value可实现双向同步值
if (props.hasOwnProperty(':value')) { if (props.hasOwnProperty(':value')) {
var valueKey = props[':value'] var valueKey = props[':value']
var valueWatcher = function() {
var val = parseVmValue(parentVm, valueKey)
Anot.vmodels[$id].value = val
}
var childValueWatcher = function() {
var val = this.value
if (val && typeof val === 'object') {
val = val.$model || val
}
parseVmValue(parentVm, valueKey, val)
}
state.value = parseVmValue(parentVm, valueKey) state.value = parseVmValue(parentVm, valueKey)
parentVm.$watch(valueKey, function(val) {
parentVm.$fire('component!' + $id + '!value', val) parentVm.$watch(valueKey, valueWatcher)
}) parentVm.$watch(valueKey + '.*', valueWatcher)
if (Array.isArray(state.value)) { parentVm.$watch(valueKey + '.length', valueWatcher)
hooks.watch['value.length'] = hooks.watch['value.length']
? [hooks.watch['value.length']] if (hooks.watch.value) {
: [] hooks.watch.value = [hooks.watch.value]
hooks.watch['value.length'].push(function(val) {
parseVmValue(parentVm, valueKey, this.value.$model)
})
} else { } else {
hooks.watch.value = hooks.watch.value ? [hooks.watch.value] : [] hooks.watch.value = []
hooks.watch.value.push(function(val) { }
parseVmValue(parentVm, valueKey, val) if (hooks.watch['value.length']) {
}) hooks.watch['value.length'] = [hooks.watch['value.length']]
} else {
hooks.watch['value.length'] = []
}
if (hooks.watch['value.*']) {
hooks.watch['value.*'] = [hooks.watch['value.*']]
} else {
hooks.watch['value.*'] = []
}
if (Array.isArray(state.value)) {
hooks.watch['value.*'].push(childValueWatcher)
hooks.watch['value.length'].push(childValueWatcher)
} else {
hooks.watch.value.push(childValueWatcher)
} }
delete props[':value'] delete props[':value']
@ -3952,7 +3975,7 @@ const _Anot = (function() {
var vmodel = Anot(hooks) var vmodel = Anot(hooks)
delete vmodel.$mounted delete vmodel.$mounted
parentVm.$children.push(vmodel) parentVm.$components.push(vmodel)
elem.msResolved = 1 //防止二进扫描此元素 elem.msResolved = 1 //防止二进扫描此元素
@ -3991,7 +4014,7 @@ const _Anot = (function() {
if (ev.childReady) { if (ev.childReady) {
dependencies += ev.childReady dependencies += ev.childReady
if (vmodel !== ev.vm) { if (vmodel !== ev.vm) {
vmodel.$children.push(ev.vm) vmodel.$components.push(ev.vm)
ev.vm.$up = vmodel ev.vm.$up = vmodel
if (ev.childReady === -1) { if (ev.childReady === -1) {
children++ children++

87
src/js/anot.shim.js
View File

@ -1739,8 +1739,10 @@
hideProperty($vmodel, '$active', false) hideProperty($vmodel, '$active', false)
hideProperty($vmodel, '$pathname', old ? old.$pathname : '') hideProperty($vmodel, '$pathname', old ? old.$pathname : '')
hideProperty($vmodel, '$accessors', accessors) hideProperty($vmodel, '$accessors', accessors)
hideProperty($vmodel, '$events', {})
hideProperty($vmodel, '$refs', {}) hideProperty($vmodel, '$refs', {})
hideProperty($vmodel, '$children', []) hideProperty($vmodel, '$children', [])
hideProperty($vmodel, '$components', [])
hideProperty($vmodel, 'hasOwnProperty', trackBy) hideProperty($vmodel, 'hasOwnProperty', trackBy)
hideProperty($vmodel, '$mounted', mounted) hideProperty($vmodel, '$mounted', mounted)
if (options.watch) { if (options.watch) {
@ -1760,16 +1762,6 @@
var v = $vmodel.$children[i] var v = $vmodel.$children[i]
v.$fire && v.$fire.apply(v, [ee, a]) v.$fire && v.$fire.apply(v, [ee, a])
} }
// component! 这是一个特殊的标识,可以直接修改子组件的state值
// 且只针对指定子组件有效
} else if (path.indexOf('component!') === 0) {
var ee = path.slice(10).split('!')
for (var i in $vmodel.$children) {
if ($vmodel.$children[i].$id === ee[0]) {
$vmodel.$children[i][ee[1]] = a
break
}
}
} else { } else {
$emit.call($vmodel, path, [a]) $emit.call($vmodel, path, [a])
} }
@ -2002,8 +1994,9 @@
throw Error(index + 'set方法的第一个参数不能大于原数组长度') throw Error(index + 'set方法的第一个参数不能大于原数组长度')
} }
if (this[index] !== val) { if (this[index] !== val) {
$emit.call(this.$up, this.$pathname + '.*', [val, this[index]]) var old = this[index]
this.splice(index, 1, val) this.splice(index, 1, val)
$emit.call(this.$up, this.$pathname + '.*', [val, old, null, index])
} }
}, },
contains: function(el) { contains: function(el) {
@ -3560,11 +3553,11 @@
} }
} }
function scanTag(elem, vmodels, node) { function scanTag(elem, vmodels) {
//扫描顺序 skip(0) --> anot(1) --> :if(10) --> :repeat(90) //扫描顺序 skip(0) --> anot(1) --> :if(10) --> :repeat(90)
//--> :if-loop(110) --> :attr(970) ...--> :duplex(2000)垫后 //--> :if-loop(110) --> :attr(970) ...--> :duplex(2000)垫后
var skip = elem.getAttribute('skip') var skip = elem.getAttribute('skip')
node = elem.getAttributeNode('anot') var node = elem.getAttributeNode('anot')
var vm = vmodels.concat() var vm = vmodels.concat()
if (typeof skip === 'string') { if (typeof skip === 'string') {
return return
@ -3581,7 +3574,10 @@
elem.removeAttribute(node.name) //removeAttributeNode不会刷新xx[anot]样式规则 elem.removeAttribute(node.name) //removeAttributeNode不会刷新xx[anot]样式规则
createSignalTower(elem, newVmodel) createSignalTower(elem, newVmodel)
hideProperty(newVmodel, '$elem', elem) hideProperty(newVmodel, '$elem', elem)
if (vmodels.length) { if (vmodels.length) {
newVmodel.$up = vmodels[0]
vmodels[0].$children.push(newVmodel)
var props = {} var props = {}
attrs.forEach(function(attr) { attrs.forEach(function(attr) {
if (/^:/.test(attr.name)) { if (/^:/.test(attr.name)) {
@ -3802,7 +3798,13 @@
function parseVmValue(vm, key, val) { function parseVmValue(vm, key, val) {
if (arguments.length === 2) { if (arguments.length === 2) {
return Function('o', 'return o.' + key)(vm) var oval = Function('o', 'return o.' + key)(vm)
if (oval && typeof oval === 'object') {
try {
return oval.$model
} catch (err) {}
}
return oval
} else if (arguments.length === 3) { } else if (arguments.length === 3) {
Function('o', 'v', 'return o.' + key + ' = v')(vm, val) Function('o', 'v', 'return o.' + key + ' = v')(vm, val)
} }
@ -3867,7 +3869,7 @@
if (disabledKeyReverse) { if (disabledKeyReverse) {
val = !val val = !val
} }
parentVm.$fire('component!' + $id + '!disabled', val) Anot.vmodels[$id].disabled = val
}) })
delete props[':disabled'] delete props[':disabled']
@ -3887,7 +3889,7 @@
if (loadingKeyReverse) { if (loadingKeyReverse) {
val = !val val = !val
} }
parentVm.$fire('component!' + $id + '!loading', val) Anot.vmodels[$id].loading = val
}) })
delete props[':loading'] delete props[':loading']
} }
@ -3895,22 +3897,43 @@
// :value可实现双向同步值 // :value可实现双向同步值
if (props.hasOwnProperty(':value')) { if (props.hasOwnProperty(':value')) {
var valueKey = props[':value'] var valueKey = props[':value']
var valueWatcher = function() {
var val = parseVmValue(parentVm, valueKey)
Anot.vmodels[$id].value = val
}
var childValueWatcher = function() {
var val = this.value
if (val && typeof val === 'object') {
val = val.$model || val
}
parseVmValue(parentVm, valueKey, val)
}
state.value = parseVmValue(parentVm, valueKey) state.value = parseVmValue(parentVm, valueKey)
parentVm.$watch(valueKey, function(val) {
parentVm.$fire('component!' + $id + '!value', val) parentVm.$watch(valueKey, valueWatcher)
}) parentVm.$watch(valueKey + '.*', valueWatcher)
if (Array.isArray(state.value)) { parentVm.$watch(valueKey + '.length', valueWatcher)
hooks.watch['value.length'] = hooks.watch['value.length']
? [hooks.watch['value.length']] if (hooks.watch.value) {
: [] hooks.watch.value = [hooks.watch.value]
hooks.watch['value.length'].push(function(val) {
parseVmValue(parentVm, valueKey, this.value.$model)
})
} else { } else {
hooks.watch.value = hooks.watch.value ? [hooks.watch.value] : [] hooks.watch.value = []
hooks.watch.value.push(function(val) { }
parseVmValue(parentVm, valueKey, val) if (hooks.watch['value.length']) {
}) hooks.watch['value.length'] = [hooks.watch['value.length']]
} else {
hooks.watch['value.length'] = []
}
if (hooks.watch['value.*']) {
hooks.watch['value.*'] = [hooks.watch['value.*']]
} else {
hooks.watch['value.*'] = []
}
if (Array.isArray(state.value)) {
hooks.watch['value.*'].push(childValueWatcher)
hooks.watch['value.length'].push(childValueWatcher)
} else {
hooks.watch.value.push(childValueWatcher)
} }
delete props[':value'] delete props[':value']
@ -3967,7 +3990,7 @@
var vmodel = Anot(hooks) var vmodel = Anot(hooks)
delete vmodel.$mounted delete vmodel.$mounted
parentVm.$children.push(vmodel) parentVm.$components.push(vmodel)
elem.msResolved = 1 //防止二进扫描此元素 elem.msResolved = 1 //防止二进扫描此元素
@ -4006,7 +4029,7 @@
if (ev.childReady) { if (ev.childReady) {
dependencies += ev.childReady dependencies += ev.childReady
if (vmodel !== ev.vm) { if (vmodel !== ev.vm) {
vmodel.$children.push(ev.vm) vmodel.$components.push(ev.vm)
ev.vm.$up = vmodel ev.vm.$up = vmodel
if (ev.childReady === -1) { if (ev.childReady === -1) {
children++ children++

12
src/js/form/index.js
View File

@ -202,6 +202,17 @@ Anot.component('checkbox', {
props: { props: {
label: '' label: ''
}, },
watch: {
'value.*'(val, old, k, kk) {
this.checked = this.value.indexOf(this.props.label) > -1
},
'value.length'(val, old, k, kk) {
this.checked = this.value.indexOf(this.props.label) > -1
},
value(val, old, k, kk) {
this.checked = this.value.indexOf(this.props.label) > -1
}
},
methods: { methods: {
onClick() { onClick() {
if (this.disabled) { if (this.disabled) {
@ -218,7 +229,6 @@ Anot.component('checkbox', {
} }
this.checked = true this.checked = true
this.value.push(label) this.value.push(label)
// this.value = !this.value
} }
} }
}) })

4
src/js/store/index.js
View File

@ -118,7 +118,7 @@ class AnotStore {
} }
// 查询多条记录,返回数组 // 查询多条记录,返回数组
getAll({ filter, limit = [] }) { getAll({ filter, limit = [] } = {}) {
const collection = __STORE__[this.__name__] const collection = __STORE__[this.__name__]
let result = [] let result = []
let forceLimited = false // 强制限制查询结果集 let forceLimited = false // 强制限制查询结果集
@ -171,7 +171,7 @@ class AnotStore {
} }
// 查询总数 // 查询总数
count({ filter }) { count({ filter } = {}) {
if (filter) { if (filter) {
if (this.__LAST_QUERY__ === JSON.stringify(filter)) { if (this.__LAST_QUERY__ === JSON.stringify(filter)) {
return this.__QUERY_HISTORY__.length return this.__QUERY_HISTORY__.length

81
src/js/tree/index.js
View File

@ -11,10 +11,12 @@ import './main.scss'
//储存版本信息 //储存版本信息
Anot.ui.tree = '1.0.0' Anot.ui.tree = '1.0.0'
const log = console.log
function format(arr, { id, parent, label, children }) { function format(arr, { id, parent, label, children }) {
let tmp = {} let tmp = {}
let farr = [] let farr = []
arr = Anot.deepCopy(arr)
arr.sort(function(a, b) { arr.sort(function(a, b) {
return a[parent] === b[parent] ? a.sort - b.sort : a[parent] - b[parent] return a[parent] === b[parent] ? a.sort - b.sort : a[parent] - b[parent]
}) })
@ -36,15 +38,32 @@ function format(arr, { id, parent, label, children }) {
} }
export default Anot.component('tree', { export default Anot.component('tree', {
render: function() { __init__: function(props, state, next) {
if (!this.list.size()) { this.classList.add('do-tree')
return null this.setAttribute(':visible', 'list.size()')
props.id = props.id || 'id'
props.label = props.label || 'label'
props.parent = props.parent || 'parent'
props.children = props.children || 'children'
if (props.list) {
for (let it of props.list) {
state.__LIST__.push(it)
state.__LIST_DICT__[it[props.id]] = it
}
} }
state.list = format(props.list || [], props)
state.multiCheck = props.hasOwnProperty('multiCheck')
delete props.list
delete props.multiCheck
next()
},
render: function() {
let { multiCheck } = this
return ` return `
<section class="do-tree__item" :repeat="list" :class="{open: el.open, dir: el[props.children]}"> <section class="do-tree__item" :repeat="list" :class="{open: el.open, dir: el[props.children]}">
<em <em
:class="{ :class="{
'do-icon-txt': !el.open && !el[props.children], 'do-icon-txt': !el[props.children],
'do-icon-folder-close': el[props.children] && !el.open, 'do-icon-folder-close': el[props.children] && !el.open,
'do-icon-folder-open': el[props.children] && el.open, 'do-icon-folder-open': el[props.children] && el.open,
}" }"
@ -58,12 +77,11 @@ export default Anot.component('tree', {
:click="__select(el)" :click="__select(el)"
:class="{active: el[props.id] === currItem}" :class="{active: el[props.id] === currItem}"
:text="el[props.label]"></span> :text="el[props.label]"></span>
<anot-tree <anot-tree ${multiCheck ? 'multi-check' : ''}
:attr="{ :attr="{
'multi-check': multiCheck,
list: el[props.children], list: el[props.children],
'@onActive': props.onActive, '@itemClick': props.itemClick,
'@onPick': __check, '@itemPicked': __check,
id: props.id, id: props.id,
label: props.label, label: props.label,
parent: props.parent, parent: props.parent,
@ -72,19 +90,7 @@ export default Anot.component('tree', {
</section> </section>
` `
}, },
__init__: function(props, state, next) {
this.classList.add('do-tree')
this.setAttribute(':if', 'list.size()')
props.id = props.id || 'id'
props.label = props.label || 'label'
props.parent = props.parent || 'parent'
props.children = props.children || 'children'
state.list = format(props.list || [], props)
state.multiCheck = !!props.multiCheck
delete props.list
delete props.multiCheck
next()
},
componentDidMount: function() { componentDidMount: function() {
this.list.forEach(it => { this.list.forEach(it => {
if (it.__checked__) { if (it.__checked__) {
@ -96,20 +102,22 @@ export default Anot.component('tree', {
} }
}, },
state: { state: {
__LIST__: [],
__LIST_DICT__: {},
list: [], list: [],
multiCheck: false, multiCheck: false,
currItem: -1, currItem: -1,
checkedItems: {} checkedItems: {}
}, },
skip: ['checkedItems'], skip: ['checkedItems', '__LIST__', '__LIST_DICT__'],
props: { props: {
id: '', id: '',
label: '', label: '',
parent: '', parent: '',
children: '', children: '',
created: Anot.PropsTypes.isFunction(), created: Anot.PropsTypes.isFunction(),
onActive: Anot.PropsTypes.isFunction(), itemClick: Anot.PropsTypes.isFunction(),
onPick: Anot.PropsTypes.isFunction() itemPicked: Anot.PropsTypes.isFunction()
}, },
methods: { methods: {
// 子目录的开关 // 子目录的开关
@ -128,17 +136,17 @@ export default Anot.component('tree', {
// return // return
let item = null let item = null
let arr = [] let arr = []
let vm, id, onPick, checkedItems let vm, id, itemPicked, checkedItems
if (this.props) { if (this.props) {
vm = this vm = this
id = this.props.id id = this.props.id
onPick = this.props.onPick itemPicked = this.props.itemPicked
checkedItems = this.checkedItems checkedItems = this.checkedItems
} else { } else {
vm = this.$up vm = this.$up
id = vm.props.id id = vm.props.id
onPick = vm.props.onPick itemPicked = vm.props.itemPicked
checkedItems = vm.checkedItems checkedItems = vm.checkedItems
} }
@ -164,23 +172,28 @@ export default Anot.component('tree', {
} }
} }
} }
if (typeof onPick === 'function') { if (typeof itemPicked === 'function') {
onPick(item, arr) itemPicked(item, arr)
} }
}, },
// 单个条目的点击选择 // 单个条目的点击选择
__select: function(el) { __select: function(el) {
let { id, onActive } = this.props let { id, itemClick } = this.props
this.currItem = el[id] this.currItem = el[id]
if (typeof onActive === 'function') { if (typeof itemClick === 'function') {
onActive(el.$model) itemClick(this.__LIST_DICT__[el[id]])
// itemClick(el.$model)
} }
}, },
// 以给定的列表重置组件渲染 // 以给定的列表重置组件渲染
resetWith: function(arr) { resetWith: function(arr = []) {
this.checked = {} this.checked = {}
this.list.clear() this.list.clear()
this.list.pushArray(format(arr || [])) for (let it of arr) {
this.__LIST__.push(it)
this.__LIST_DICT__[it[this.props.id]] = it
}
this.list.pushArray(format(arr || [], this.props))
} }
} }
}) })

2
src/js/tree/main.scss
View File

@ -22,7 +22,7 @@
&:hover {color:nth($cd, 1);} &:hover {color:nth($cd, 1);}
&.active {color:nth($cd, 3);font-weight:bold;} &.active {color:nth($cd, 3);font-weight:bold;}
&.checkbox {float:left;position:relative;width:20px;height:20px;margin:8px 5px 8px 0;line-height:18px;border:1px solid nth($cd, 2);border-radius:3px; font-size:20px;text-align:center;} &.checkbox {float:left;position:relative;width:18px;height:18px;margin:8px 5px 8px 0;line-height:16px;border:1px solid nth($cd, 2);border-radius:3px; font-size:16px;text-align:center;}
} }
} }
&__item.open>.do-tree {display:block;} &__item.open>.do-tree {display:block;}