Browse Source

remove dynamic literal

Evan You 10 years ago
parent
commit
e70f714b20

+ 12 - 12
src/compiler/compile.js

@@ -457,19 +457,19 @@ function checkElementDirectives (el, options) {
  *
  * @param {Element} el
  * @param {Object} options
- * @param {Boolean} hasAttrs
  * @return {Function|undefined}
  */
 
-function checkComponent (el, options, hasAttrs) {
+function checkComponent (el, options) {
   // TODO handle literal/dynamic
-  var componentId = _.checkComponent(el, options, hasAttrs)
-  var descriptor = {
-    name: 'component',
-    expression: componentId,
-    def: publicDirectives.component
-  }
-  if (componentId) {
+  var component = _.checkComponent(el, options)
+  if (component) {
+    var descriptor = {
+      name: 'component',
+      expression: component.id,
+      literal: !component.dynamic,
+      def: publicDirectives.component
+    }
     var componentLinkFn = function (vm, el, host, scope, frag) {
       vm._bindDir(descriptor, el, host, scope, frag)
     }
@@ -544,7 +544,7 @@ function makeTerminalNodeLinkFn (el, dirName, value, options, def) {
 function compileDirectives (attrs, options) {
   var i = attrs.length
   var dirs = []
-  var attr, name, value, dirName, dirDef, parsed, isLiteral, arg
+  var attr, name, value, dirName, dirDef, parsed, isLiteral
   while (i--) {
     attr = attrs[i]
     name = attr.name
@@ -577,14 +577,14 @@ function compileDirectives (attrs, options) {
     // special case for el
     if (name === 'el' || name === 'bind-el') {
       pushDir('el', internalDirectives.el, {
-        literal: bindRE.test(name)
+        literal: !bindRE.test(name)
       })
     } else
 
     // special case for transition
     if (name === 'transition' || name === 'bind-transition') {
       pushDir('transition', internalDirectives.transition, {
-        literal: bindRE.test(name)
+        literal: !bindRE.test(name)
       })
     } else
 

+ 8 - 30
src/directive.js

@@ -1,7 +1,6 @@
 var _ = require('./util')
 var config = require('./config')
 var Watcher = require('./watcher')
-var textParser = require('./parsers/text')
 var expParser = require('./parsers/expression')
 
 /**
@@ -35,6 +34,7 @@ function Directive (descriptor, vm, el, host, scope, frag) {
   this.expression = descriptor.expression
   this.arg = descriptor.arg
   this.filters = descriptor.filters
+  this.literal = descriptor.literal
   // private
   this._locked = false
   this._bound = false
@@ -74,20 +74,18 @@ Directive.prototype._bind = function () {
     _.extend(this, def)
   }
 
-  this._watcherExp = this.expression
-  this._checkDynamicLiteral()
-
   // initial bind
   if (this.bind) {
     this.bind()
   }
 
-  if (descriptor.literal) {
+  if (this.literal) {
     this.update && this.update(descriptor.raw)
-  } else if (this._watcherExp &&
-      (this.update || this.twoWay) &&
-      (!this.isLiteral || this._isDynamicLiteral) &&
-      !this._checkStatement()) {
+  } else if (
+    this.expression &&
+    (this.update || this.twoWay) &&
+    !this._checkStatement()
+  ) {
     // wrapped updater for context
     var dir = this
     var update = this._update = this.update
@@ -104,7 +102,7 @@ Directive.prototype._bind = function () {
       : null
     var watcher = this._watcher = new Watcher(
       this.vm,
-      this._watcherExp,
+      this.expression,
       update, // callback
       {
         filters: this.filters,
@@ -123,26 +121,6 @@ Directive.prototype._bind = function () {
   this._bound = true
 }
 
-/**
- * check if this is a dynamic literal binding.
- *
- * e.g. v-component="{{currentView}}"
- */
-
-// TODO: we shouldn't need this in 1.0.0.
-Directive.prototype._checkDynamicLiteral = function () {
-  var expression = this.expression
-  if (expression && this.isLiteral) {
-    var tokens = textParser.parse(expression)
-    if (tokens) {
-      var exp = textParser.tokensToExp(tokens)
-      this.expression = this.vm.$get(exp)
-      this._watcherExp = exp
-      this._isDynamicLiteral = true
-    }
-  }
-}
-
 /**
  * Check if the directive is a function caller
  * and if the expression is a callable one. If both true,

+ 0 - 1
src/directives/internal/el.js

@@ -2,7 +2,6 @@ var _ = require('../../util')
 
 module.exports = {
 
-  isLiteral: true,
   priority: 1500,
 
   bind: function () {

+ 0 - 9
src/directives/internal/transition.js

@@ -4,15 +4,6 @@ var Transition = require('../../transition/transition')
 module.exports = {
 
   priority: 1000,
-  isLiteral: true,
-
-  bind: function () {
-    if (!this._isDynamicLiteral && !this.arg) {
-      this.update(this.expression)
-    } else if (this.arg) {
-      this._isDynamicLiteral = true
-    }
-  },
 
   update: function (id, oldId) {
     var el = this.el

+ 5 - 4
src/directives/public/component.js

@@ -3,7 +3,6 @@ var templateParser = require('../../parsers/template')
 
 module.exports = {
 
-  isLiteral: true,
   priority: 1500,
 
   /**
@@ -47,7 +46,7 @@ module.exports = {
       this.pendingRemovals = 0
       this.pendingRemovalCb = null
       // if static, build right now.
-      if (!this._isDynamicLiteral) {
+      if (this.literal) {
         this.resolveComponent(this.expression, _.bind(this.initStatic, this))
       } else {
         // check dynamic component params
@@ -85,11 +84,13 @@ module.exports = {
 
   /**
    * Public update, called by the watcher in the dynamic
-   * literal scenario, e.g. v-component="{{view}}"
+   * literal scenario, e.g. <component bind-is="view">
    */
 
   update: function (value) {
-    this.setComponent(value)
+    if (!this.literal) {
+      this.setComponent(value)
+    }
   },
 
   /**

+ 1 - 1
src/directives/public/for.js

@@ -14,7 +14,7 @@ module.exports = {
     var inMatch = this.expression.match(/(.*) in (.*)/)
     if (inMatch) {
       this.alias = inMatch[1]
-      this._watcherExp = inMatch[2]
+      this.expression = inMatch[2]
     }
 
     if (!this.alias) {

+ 5 - 7
src/util/component.js

@@ -6,7 +6,7 @@ var _ = require('./index')
  *
  * @param {Element} el
  * @param {Object} options
- * @return {String|undefined}
+ * @return {Object|undefined}
  */
 
 exports.commonTagRE = /^(div|p|span|img|a|b|i|br|ul|ol|li|h1|h2|h3|h4|h5|h6|code|pre|table|th|td|tr|form|label|input|select|option)$/
@@ -17,19 +17,17 @@ exports.checkComponent = function (el, options) {
     var exp = el.getAttribute('is')
     if (exp != null) {
       el.removeAttribute('is')
+      return { id: exp }
     } else {
       exp = el.getAttribute('bind-is')
       if (exp != null) {
-        // leverage literal dynamic for now.
-        // TODO: make this cleaner
-        exp = '{{' + exp + '}}'
         el.removeAttribute('bind-is')
+        return { id: exp, dynamic: true }
       }
     }
-    return exp
   } else if (!exports.commonTagRE.test(tag)) {
     if (_.resolveAsset(options, 'components', tag)) {
-      return tag
+      return { id: tag }
     } else if (process.env.NODE_ENV !== 'production') {
       if (tag.indexOf('-') > -1 ||
           /HTMLUnknownElement/.test(Object.prototype.toString.call(el))) {
@@ -43,7 +41,7 @@ exports.checkComponent = function (el, options) {
   /* eslint-disable no-cond-assign */
   if (tag = _.attr(el, 'component')) {
   /* eslint-enable no-cond-assign */
-    return tag
+    return { id: tag }
   }
 }