组件增加<anot-xxx>方式;组件机制增加一个推送方法,减少各种表单的繁琐

src/js/anot.js

@@ -2336,7 +2336,9 @@ const _Anot = (function() {
     }
     return el.msRetain
       ? 0
-      : el.nodeType === 1 ? !root.contains(el) : !Anot.contains(root, el)
+      : el.nodeType === 1
+        ? !root.contains(el)
+        : !Anot.contains(root, el)
   }
 
   /************************************************************************
@@ -2627,7 +2629,9 @@ const _Anot = (function() {
               ? null
               : +data + '' === data
                 ? +data
-                : rbrace.test(data) ? JSON.parse(data) : data
+                : rbrace.test(data)
+                  ? JSON.parse(data)
+                  : data
     } catch (e) {}
     return data
   }
@@ -2665,7 +2669,9 @@ const _Anot = (function() {
   function getWindow(node) {
     return node.window && node.document
       ? node
-      : node.nodeType === 9 ? node.defaultView : false
+      : node.nodeType === 9
+        ? node.defaultView
+        : false
   }
 
   //=============================css相关==================================
@@ -3762,6 +3768,13 @@ const _Anot = (function() {
           }
           var props = getOptionsFromTag(elem, host.vmodels)
           var $id = props.uuid || generateID(widget)
+          var __willpush__ = null
+
+          if (props.hasOwnProperty('hostPush')) {
+            elem.removeAttribute('host-push')
+            __willpush__ = props.hostPush
+            props.hostPush = host.vmodels[0][__willpush__]
+          }
 
           delete props.uuid
           delete props.name
@@ -3796,14 +3809,28 @@ const _Anot = (function() {
 
           elem.msResolved = 1 //防止二进扫描此元素
 
+          if (__willpush__) {
+            hideProperty(vmodel, '$push', function(val) {
+              host.vmodels[0][__willpush__] = val
+            })
+          }
+
           componentWillMount.call(vmodel)
           globalHooks.componentWillMount.call(null, vmodel)
 
           var slots = null
+          var isTemplate = true
 
+          if (elem.content) {
             if (elem.content.firstElementChild) {
               slots = parseSlot(elem.content.children)
             }
+          } else {
+            isTemplate = false
+            if (elem.firstElementChild) {
+              slots = parseSlot(elem.children)
+            }
+          }
 
           Anot.clearHTML(elem)
           var html = render.call(vmodel, slots) || ''
@@ -3814,7 +3841,8 @@ const _Anot = (function() {
 
           elem.innerHTML = html
 
-          // 组件所使用的标签是temlate,所以必须要要用子元素替换掉
+          if (isTemplate) {
+            // 组件所使用的标签是template,所以必须要要用子元素替换掉
             var child = elem.content.firstElementChild
             var nullComponent = DOC.createComment('empty component')
             elem.parentNode.replaceChild(child || nullComponent, elem)
@@ -3829,10 +3857,10 @@ const _Anot = (function() {
             var className = elem.className
             elem = host.element = child
             elem.style && (elem.style.cssText += ';' + cssText)
-
             if (className) {
               Anot(elem).addClass(className)
             }
+          }
 
           hideProperty(vmodel, '$elem', elem)
 
@@ -3905,6 +3933,9 @@ const _Anot = (function() {
     if (name === 'template' && el.getAttribute('name')) {
       return el.getAttribute('name')
     }
+    if (/^anot-([a-z][a-z0-9\-]*)$/.test(name)) {
+      return RegExp.$1
+    }
     return null
   }
 
@@ -4047,7 +4078,9 @@ const _Anot = (function() {
           //SVG只能使用setAttribute(xxx, yyy), VML只能使用elem.xxx = yyy ,HTML的固有属性必须elem.xxx = yyy
           var isInnate = rsvg.test(elem)
             ? false
-            : DOC.namespaces && isVML(elem) ? true : k in elem.cloneNode(false)
+            : DOC.namespaces && isVML(elem)
+              ? true
+              : k in elem.cloneNode(false)
           if (isInnate) {
             elem[k] = obj[i]
           } else {

src/js/anot.shim.js

@@ -2351,7 +2351,9 @@
     }
     return el.msRetain
       ? 0
-      : el.nodeType === 1 ? !root.contains(el) : !Anot.contains(root, el)
+      : el.nodeType === 1
+        ? !root.contains(el)
+        : !Anot.contains(root, el)
   }
 
   /************************************************************************
@@ -2642,7 +2644,9 @@
               ? null
               : +data + '' === data
                 ? +data
-                : rbrace.test(data) ? JSON.parse(data) : data
+                : rbrace.test(data)
+                  ? JSON.parse(data)
+                  : data
     } catch (e) {}
     return data
   }
@@ -2680,7 +2684,9 @@
   function getWindow(node) {
     return node.window && node.document
       ? node
-      : node.nodeType === 9 ? node.defaultView : false
+      : node.nodeType === 9
+        ? node.defaultView
+        : false
   }
 
   //=============================css相关==================================
@@ -3186,18 +3192,7 @@
       })
       expr = '\nreturn ' + expr + ';' //IE全家 Function("return ")出错，需要Function("return ;")
     }
-    // log('')
+
-    // log(
-    //   names
-    //     .concat(
-    //       "'use strict';\ntry{\nvar " +
-    //         assigns.join(',\n') +
-    //         expr +
-    //         '\n}catch(e){console.log(e)}'
-    //     )
-    //     .join('')
-    // )
-    // log('')
     /* jshint ignore:start */
     getter = scpCompile(
       names.concat(
@@ -3788,6 +3783,13 @@
           }
           var props = getOptionsFromTag(elem, host.vmodels)
           var $id = props.uuid || generateID(widget)
+          var __willpush__ = null
+
+          if (props.hasOwnProperty('hostPush')) {
+            elem.removeAttribute('host-push')
+            __willpush__ = props.hostPush
+            props.hostPush = host.vmodels[0][__willpush__]
+          }
 
           delete props.uuid
           delete props.name
@@ -3822,14 +3824,28 @@
 
           elem.msResolved = 1 //防止二进扫描此元素
 
+          if (__willpush__) {
+            hideProperty(vmodel, '$push', function(val) {
+              host.vmodels[0][__willpush__] = val
+            })
+          }
+
           componentWillMount.call(vmodel)
           globalHooks.componentWillMount.call(null, vmodel)
 
           var slots = null
+          var isTemplate = true
 
+          if (elem.content) {
             if (elem.content.firstElementChild) {
               slots = parseSlot(elem.content.children)
             }
+          } else {
+            isTemplate = false
+            if (elem.firstElementChild) {
+              slots = parseSlot(elem.children)
+            }
+          }
 
           Anot.clearHTML(elem)
           var html = render.call(vmodel, slots) || ''
@@ -3840,7 +3856,8 @@
 
           elem.innerHTML = html
 
-          // 组件所使用的标签是temlate,所以必须要要用子元素替换掉
+          if (isTemplate) {
+            // 组件所使用的标签是template,所以必须要要用子元素替换掉
             var child = elem.content.firstElementChild
             var nullComponent = DOC.createComment('empty component')
             elem.parentNode.replaceChild(child || nullComponent, elem)
@@ -3855,10 +3872,10 @@
             var className = elem.className
             elem = host.element = child
             elem.style && (elem.style.cssText += ';' + cssText)
-
             if (className) {
               Anot(elem).addClass(className)
             }
+          }
 
           hideProperty(vmodel, '$elem', elem)
 
@@ -3931,6 +3948,9 @@
     if (name === 'template' && el.getAttribute('name')) {
       return el.getAttribute('name')
     }
+    if (/^anot-([a-z][a-z0-9\-]*)$/.test(name)) {
+      return RegExp.$1
+    }
     return null
   }
 
@@ -4073,7 +4093,9 @@
           //SVG只能使用setAttribute(xxx, yyy), VML只能使用elem.xxx = yyy ,HTML的固有属性必须elem.xxx = yyy
           var isInnate = rsvg.test(elem)
             ? false
-            : DOC.namespaces && isVML(elem) ? true : k in elem.cloneNode(false)
+            : DOC.namespaces && isVML(elem)
+              ? true
+              : k in elem.cloneNode(false)
           if (isInnate) {
             elem[k] = obj[i]
           } else {