优化组件slots插槽机制
parent
2edf946c2d
commit
220d67d610
|
@ -3750,29 +3750,41 @@ const _Anot = (function() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function parseSlot(collections) {
|
function parseSlot(collections, vms) {
|
||||||
var arr = aslice.call(collections, 0)
|
var arr = aslice.call(collections, 0)
|
||||||
var obj = { __extra__: [] }
|
var obj = { __extra__: [] }
|
||||||
arr.forEach(function(elem) {
|
arr.forEach(function(elem) {
|
||||||
|
switch (elem.nodeType) {
|
||||||
|
case 1:
|
||||||
var slot = elem.getAttribute('slot')
|
var slot = elem.getAttribute('slot')
|
||||||
if (isWidget(elem)) {
|
|
||||||
obj.__extra__.push(elem)
|
|
||||||
} else {
|
|
||||||
if (slot) {
|
if (slot) {
|
||||||
obj[slot] = obj[slot] || []
|
obj[slot] = obj[slot] || []
|
||||||
elem.removeAttribute('slot')
|
elem.removeAttribute('slot')
|
||||||
obj[slot].push(elem.outerHTML)
|
obj[slot].push(elem.outerHTML)
|
||||||
} else {
|
} else {
|
||||||
if (
|
var txt = elem.outerHTML
|
||||||
rexpr.test(elem.outerHTML) ||
|
if (isWidget(elem) || /:[\w-]*=".*"/.test(txt)) {
|
||||||
/:[\w-]*=".*"/.test(elem.outerHTML)
|
break
|
||||||
) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
obj.__extra__.push(elem)
|
|
||||||
}
|
}
|
||||||
|
if (rexpr.test(txt)) {
|
||||||
|
var expr = normalizeExpr(txt)
|
||||||
|
txt = parseExpr(expr, vms, {}).apply(0, vms)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
obj.__extra__.push(txt)
|
||||||
|
}
|
||||||
|
|
||||||
|
break
|
||||||
|
case 3:
|
||||||
|
var txt = elem.textContent.trim()
|
||||||
|
if (txt) {
|
||||||
|
obj.__extra__.push(txt)
|
||||||
|
}
|
||||||
|
break
|
||||||
|
default:
|
||||||
|
break
|
||||||
|
}
|
||||||
elem.parentNode.removeChild(elem)
|
elem.parentNode.removeChild(elem)
|
||||||
})
|
})
|
||||||
return obj
|
return obj
|
||||||
|
@ -3827,8 +3839,9 @@ const _Anot = (function() {
|
||||||
while (parentVm.$up && parentVm.$up.__WIDGET__ === name) {
|
while (parentVm.$up && parentVm.$up.__WIDGET__ === name) {
|
||||||
parentVm = parentVm.$up
|
parentVm = parentVm.$up
|
||||||
}
|
}
|
||||||
if (elem.firstElementChild) {
|
|
||||||
slots = parseSlot(elem.children)
|
if (elem.childNodes.length) {
|
||||||
|
slots = parseSlot(elem.childNodes, host.vmodels)
|
||||||
}
|
}
|
||||||
|
|
||||||
if (props.hasOwnProperty(':disabled')) {
|
if (props.hasOwnProperty(':disabled')) {
|
||||||
|
@ -3927,22 +3940,9 @@ const _Anot = (function() {
|
||||||
Object.assign(hooks.state, state)
|
Object.assign(hooks.state, state)
|
||||||
|
|
||||||
var __READY__ = false
|
var __READY__ = false
|
||||||
elem.parseExpr = function(str) {
|
|
||||||
str = str.trim()
|
|
||||||
var expr = normalizeExpr(str)
|
|
||||||
if (expr === str) {
|
|
||||||
return str
|
|
||||||
}
|
|
||||||
try {
|
|
||||||
return parseExpr(expr, host.vmodels, {}).apply(0, host.vmodels)
|
|
||||||
} catch (err) {
|
|
||||||
return str
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
hooks.__init__.call(elem, hooks.props, hooks.state, function next() {
|
hooks.__init__.call(elem, hooks.props, hooks.state, function next() {
|
||||||
__READY__ = true
|
__READY__ = true
|
||||||
delete elem.parseExpr
|
|
||||||
})
|
})
|
||||||
|
|
||||||
if (!__READY__) {
|
if (!__READY__) {
|
||||||
|
|
|
@ -3765,29 +3765,41 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function parseSlot(collections) {
|
function parseSlot(collections, vms) {
|
||||||
var arr = aslice.call(collections, 0)
|
var arr = aslice.call(collections, 0)
|
||||||
var obj = { __extra__: [] }
|
var obj = { __extra__: [] }
|
||||||
arr.forEach(function(elem) {
|
arr.forEach(function(elem) {
|
||||||
|
switch (elem.nodeType) {
|
||||||
|
case 1:
|
||||||
var slot = elem.getAttribute('slot')
|
var slot = elem.getAttribute('slot')
|
||||||
if (isWidget(elem)) {
|
|
||||||
obj.__extra__.push(elem)
|
|
||||||
} else {
|
|
||||||
if (slot) {
|
if (slot) {
|
||||||
obj[slot] = obj[slot] || []
|
obj[slot] = obj[slot] || []
|
||||||
elem.removeAttribute('slot')
|
elem.removeAttribute('slot')
|
||||||
obj[slot].push(elem.outerHTML)
|
obj[slot].push(elem.outerHTML)
|
||||||
} else {
|
} else {
|
||||||
if (
|
var txt = elem.outerHTML
|
||||||
rexpr.test(elem.outerHTML) ||
|
if (isWidget(elem) || /:[\w-]*=".*"/.test(txt)) {
|
||||||
/:[\w-]*=".*"/.test(elem.outerHTML)
|
break
|
||||||
) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
obj.__extra__.push(elem)
|
|
||||||
}
|
}
|
||||||
|
if (rexpr.test(txt)) {
|
||||||
|
var expr = normalizeExpr(txt)
|
||||||
|
txt = parseExpr(expr, vms, {}).apply(0, vms)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
obj.__extra__.push(txt)
|
||||||
|
}
|
||||||
|
|
||||||
|
break
|
||||||
|
case 3:
|
||||||
|
var txt = elem.textContent.trim()
|
||||||
|
if (txt) {
|
||||||
|
obj.__extra__.push(txt)
|
||||||
|
}
|
||||||
|
break
|
||||||
|
default:
|
||||||
|
break
|
||||||
|
}
|
||||||
elem.parentNode.removeChild(elem)
|
elem.parentNode.removeChild(elem)
|
||||||
})
|
})
|
||||||
return obj
|
return obj
|
||||||
|
@ -3842,8 +3854,9 @@
|
||||||
while (parentVm.$up && parentVm.$up.__WIDGET__ === name) {
|
while (parentVm.$up && parentVm.$up.__WIDGET__ === name) {
|
||||||
parentVm = parentVm.$up
|
parentVm = parentVm.$up
|
||||||
}
|
}
|
||||||
if (elem.firstElementChild) {
|
|
||||||
slots = parseSlot(elem.children)
|
if (elem.childNodes.length) {
|
||||||
|
slots = parseSlot(elem.childNodes, host.vmodels)
|
||||||
}
|
}
|
||||||
|
|
||||||
if (props.hasOwnProperty(':disabled')) {
|
if (props.hasOwnProperty(':disabled')) {
|
||||||
|
@ -3942,22 +3955,9 @@
|
||||||
Object.assign(hooks.state, state)
|
Object.assign(hooks.state, state)
|
||||||
|
|
||||||
var __READY__ = false
|
var __READY__ = false
|
||||||
elem.parseExpr = function(str) {
|
|
||||||
str = str.trim()
|
|
||||||
var expr = normalizeExpr(str)
|
|
||||||
if (expr === str) {
|
|
||||||
return str
|
|
||||||
}
|
|
||||||
try {
|
|
||||||
return parseExpr(expr, host.vmodels, {}).apply(0, host.vmodels)
|
|
||||||
} catch (err) {
|
|
||||||
return str
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
hooks.__init__.call(elem, hooks.props, hooks.state, function next() {
|
hooks.__init__.call(elem, hooks.props, hooks.state, function next() {
|
||||||
__READY__ = true
|
__READY__ = true
|
||||||
delete elem.parseExpr
|
|
||||||
})
|
})
|
||||||
|
|
||||||
if (!__READY__) {
|
if (!__READY__) {
|
||||||
|
|
|
@ -3750,29 +3750,41 @@ const _Anot = (function() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function parseSlot(collections) {
|
function parseSlot(collections, vms) {
|
||||||
var arr = aslice.call(collections, 0)
|
var arr = aslice.call(collections, 0)
|
||||||
var obj = { __extra__: [] }
|
var obj = { __extra__: [] }
|
||||||
arr.forEach(function(elem) {
|
arr.forEach(function(elem) {
|
||||||
|
switch (elem.nodeType) {
|
||||||
|
case 1:
|
||||||
var slot = elem.getAttribute('slot')
|
var slot = elem.getAttribute('slot')
|
||||||
if (isWidget(elem)) {
|
|
||||||
obj.__extra__.push(elem)
|
|
||||||
} else {
|
|
||||||
if (slot) {
|
if (slot) {
|
||||||
obj[slot] = obj[slot] || []
|
obj[slot] = obj[slot] || []
|
||||||
elem.removeAttribute('slot')
|
elem.removeAttribute('slot')
|
||||||
obj[slot].push(elem.outerHTML)
|
obj[slot].push(elem.outerHTML)
|
||||||
} else {
|
} else {
|
||||||
if (
|
var txt = elem.outerHTML
|
||||||
rexpr.test(elem.outerHTML) ||
|
if (isWidget(elem) || /:[\w-]*=".*"/.test(txt)) {
|
||||||
/:[\w-]*=".*"/.test(elem.outerHTML)
|
break
|
||||||
) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
obj.__extra__.push(elem)
|
|
||||||
}
|
}
|
||||||
|
if (rexpr.test(txt)) {
|
||||||
|
var expr = normalizeExpr(txt)
|
||||||
|
txt = parseExpr(expr, vms, {}).apply(0, vms)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
obj.__extra__.push(txt)
|
||||||
|
}
|
||||||
|
|
||||||
|
break
|
||||||
|
case 3:
|
||||||
|
var txt = elem.textContent.trim()
|
||||||
|
if (txt) {
|
||||||
|
obj.__extra__.push(txt)
|
||||||
|
}
|
||||||
|
break
|
||||||
|
default:
|
||||||
|
break
|
||||||
|
}
|
||||||
elem.parentNode.removeChild(elem)
|
elem.parentNode.removeChild(elem)
|
||||||
})
|
})
|
||||||
return obj
|
return obj
|
||||||
|
@ -3827,8 +3839,9 @@ const _Anot = (function() {
|
||||||
while (parentVm.$up && parentVm.$up.__WIDGET__ === name) {
|
while (parentVm.$up && parentVm.$up.__WIDGET__ === name) {
|
||||||
parentVm = parentVm.$up
|
parentVm = parentVm.$up
|
||||||
}
|
}
|
||||||
if (elem.firstElementChild) {
|
|
||||||
slots = parseSlot(elem.children)
|
if (elem.childNodes.length) {
|
||||||
|
slots = parseSlot(elem.childNodes, host.vmodels)
|
||||||
}
|
}
|
||||||
|
|
||||||
if (props.hasOwnProperty(':disabled')) {
|
if (props.hasOwnProperty(':disabled')) {
|
||||||
|
@ -3927,22 +3940,9 @@ const _Anot = (function() {
|
||||||
Object.assign(hooks.state, state)
|
Object.assign(hooks.state, state)
|
||||||
|
|
||||||
var __READY__ = false
|
var __READY__ = false
|
||||||
elem.parseExpr = function(str) {
|
|
||||||
str = str.trim()
|
|
||||||
var expr = normalizeExpr(str)
|
|
||||||
if (expr === str) {
|
|
||||||
return str
|
|
||||||
}
|
|
||||||
try {
|
|
||||||
return parseExpr(expr, host.vmodels, {}).apply(0, host.vmodels)
|
|
||||||
} catch (err) {
|
|
||||||
return str
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
hooks.__init__.call(elem, hooks.props, hooks.state, function next() {
|
hooks.__init__.call(elem, hooks.props, hooks.state, function next() {
|
||||||
__READY__ = true
|
__READY__ = true
|
||||||
delete elem.parseExpr
|
|
||||||
})
|
})
|
||||||
|
|
||||||
if (!__READY__) {
|
if (!__READY__) {
|
||||||
|
|
|
@ -3765,29 +3765,41 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function parseSlot(collections) {
|
function parseSlot(collections, vms) {
|
||||||
var arr = aslice.call(collections, 0)
|
var arr = aslice.call(collections, 0)
|
||||||
var obj = { __extra__: [] }
|
var obj = { __extra__: [] }
|
||||||
arr.forEach(function(elem) {
|
arr.forEach(function(elem) {
|
||||||
|
switch (elem.nodeType) {
|
||||||
|
case 1:
|
||||||
var slot = elem.getAttribute('slot')
|
var slot = elem.getAttribute('slot')
|
||||||
if (isWidget(elem)) {
|
|
||||||
obj.__extra__.push(elem)
|
|
||||||
} else {
|
|
||||||
if (slot) {
|
if (slot) {
|
||||||
obj[slot] = obj[slot] || []
|
obj[slot] = obj[slot] || []
|
||||||
elem.removeAttribute('slot')
|
elem.removeAttribute('slot')
|
||||||
obj[slot].push(elem.outerHTML)
|
obj[slot].push(elem.outerHTML)
|
||||||
} else {
|
} else {
|
||||||
if (
|
var txt = elem.outerHTML
|
||||||
rexpr.test(elem.outerHTML) ||
|
if (isWidget(elem) || /:[\w-]*=".*"/.test(txt)) {
|
||||||
/:[\w-]*=".*"/.test(elem.outerHTML)
|
break
|
||||||
) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
obj.__extra__.push(elem)
|
|
||||||
}
|
}
|
||||||
|
if (rexpr.test(txt)) {
|
||||||
|
var expr = normalizeExpr(txt)
|
||||||
|
txt = parseExpr(expr, vms, {}).apply(0, vms)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
obj.__extra__.push(txt)
|
||||||
|
}
|
||||||
|
|
||||||
|
break
|
||||||
|
case 3:
|
||||||
|
var txt = elem.textContent.trim()
|
||||||
|
if (txt) {
|
||||||
|
obj.__extra__.push(txt)
|
||||||
|
}
|
||||||
|
break
|
||||||
|
default:
|
||||||
|
break
|
||||||
|
}
|
||||||
elem.parentNode.removeChild(elem)
|
elem.parentNode.removeChild(elem)
|
||||||
})
|
})
|
||||||
return obj
|
return obj
|
||||||
|
@ -3842,8 +3854,9 @@
|
||||||
while (parentVm.$up && parentVm.$up.__WIDGET__ === name) {
|
while (parentVm.$up && parentVm.$up.__WIDGET__ === name) {
|
||||||
parentVm = parentVm.$up
|
parentVm = parentVm.$up
|
||||||
}
|
}
|
||||||
if (elem.firstElementChild) {
|
|
||||||
slots = parseSlot(elem.children)
|
if (elem.childNodes.length) {
|
||||||
|
slots = parseSlot(elem.childNodes, host.vmodels)
|
||||||
}
|
}
|
||||||
|
|
||||||
if (props.hasOwnProperty(':disabled')) {
|
if (props.hasOwnProperty(':disabled')) {
|
||||||
|
@ -3942,22 +3955,9 @@
|
||||||
Object.assign(hooks.state, state)
|
Object.assign(hooks.state, state)
|
||||||
|
|
||||||
var __READY__ = false
|
var __READY__ = false
|
||||||
elem.parseExpr = function(str) {
|
|
||||||
str = str.trim()
|
|
||||||
var expr = normalizeExpr(str)
|
|
||||||
if (expr === str) {
|
|
||||||
return str
|
|
||||||
}
|
|
||||||
try {
|
|
||||||
return parseExpr(expr, host.vmodels, {}).apply(0, host.vmodels)
|
|
||||||
} catch (err) {
|
|
||||||
return str
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
hooks.__init__.call(elem, hooks.props, hooks.state, function next() {
|
hooks.__init__.call(elem, hooks.props, hooks.state, function next() {
|
||||||
__READY__ = true
|
__READY__ = true
|
||||||
delete elem.parseExpr
|
|
||||||
})
|
})
|
||||||
|
|
||||||
if (!__READY__) {
|
if (!__READY__) {
|
||||||
|
|
|
@ -12,7 +12,6 @@ Anot.ui.form = '0.1.0'
|
||||||
// 按钮
|
// 按钮
|
||||||
Anot.component('button', {
|
Anot.component('button', {
|
||||||
__init__(props, state, next) {
|
__init__(props, state, next) {
|
||||||
state.text = this.parseExpr(this.textContent)
|
|
||||||
state.style = { 'border-radius': props.radius }
|
state.style = { 'border-radius': props.radius }
|
||||||
this.classList.add('do-fn-noselect')
|
this.classList.add('do-fn-noselect')
|
||||||
this.classList.add('do-button')
|
this.classList.add('do-button')
|
||||||
|
@ -33,7 +32,8 @@ Anot.component('button', {
|
||||||
|
|
||||||
next()
|
next()
|
||||||
},
|
},
|
||||||
render() {
|
render(slots) {
|
||||||
|
this.text = slots.__extra__.join('')
|
||||||
let icon = ''
|
let icon = ''
|
||||||
if (this.props.icon) {
|
if (this.props.icon) {
|
||||||
icon = `<i class="do-button__icon do-icon-${this.props.icon}"></i>`
|
icon = `<i class="do-button__icon do-icon-${this.props.icon}"></i>`
|
||||||
|
|
Reference in New Issue