support new ref syntax

Author: yyx990803

src/directive.js

@@ -208,15 +208,6 @@ Directive.prototype.param = function (name) {
   if (param != null) {
     this.el.removeAttribute(name)
     param = (this._scope || this.vm).$interpolate(param)
-  } else {
-    param = _.getBindAttr(this.el, name)
-    if (param != null) {
-      param = (this._scope || this.vm).$eval(param)
-      process.env.NODE_ENV !== 'production' && _.log(
-        'You are using bind- syntax on "' + name + '", which ' +
-        'is a directive param. It will be evaluated only once.'
-      )
-    }
   }
   return param
 }

src/directives/component.js

@@ -41,7 +41,7 @@ module.exports = {
       if (process.env.NODE_ENV !== 'production' && ref) {
         _.deprecation.V_REF()
       }
-      this.ref = ref || this.param('ref')
+      this.ref = ref || _.findRef(this.el)
       var refs = (this._scope || this.vm).$
       if (this.ref && !refs.hasOwnProperty(this.ref)) {
         _.defineReactive(refs, this.ref, null)

src/directives/el.js

@@ -6,9 +6,7 @@ module.exports = {
   priority: 1500,
 
   bind: function () {
-    if (this.arg) {
-      this._isDynamicLiteral = true
-    } else {
+    if (!this._isDynamicLiteral) {
       this.update(this.expression)
     }
   },

src/directives/for.js

@@ -55,7 +55,7 @@ module.exports = {
     if (process.env.NODE_ENV !== 'production' && ref) {
       _.deprecation.V_REF()
     }
-    this.ref = ref || this.param('ref')
+    this.ref = ref || _.findRef(this.el)
 
     // check for transition stagger
     var stagger = +this.param('stagger')

src/directives/repeat.js

@@ -75,7 +75,7 @@ module.exports = {
       if (this.refId) _.deprecation.V_REF()
       if (this.elID) _.deprecation.V_EL()
     }
-    this.refId = this.refId || this.param('ref')
+    this.refId = this.refId || _.findRef(this.el)
 
     // check other directives that need to be handled
     // at v-repeat level

src/util/dom.js

@@ -79,6 +79,20 @@ exports.getBindAttr = function (node, name) {
   return val
 }
 
+var refRE = /^\$\./
+exports.findRef = function (node) {
+  if (node.hasAttributes()) {
+    var attrs = node.attributes
+    for (var i = 0, l = attrs.length; i < l; i++) {
+      var name = attrs[i].name
+      if (refRE.test(name)) {
+        node.removeAttribute(name)
+        return name.replace(refRE, '')
+      }
+    }
+  }
+}
+
 /**
  * Insert el before target
  *

src/util/lang.js

@@ -236,6 +236,7 @@ exports.define = function (obj, key, val, enumerable) {
 exports.defineReactive = function (obj, key, val) {
   var dep = new Dep()
   Object.defineProperty(obj, key, {
+    enumerable: true,
     get: function metaGetter () {
       if (Dep.target) {
         dep.depend()

test/unit/specs/directives/el_spec.js

@@ -22,6 +22,25 @@ if (_.inBrowser) {
       expect(vm.$$.test).toBeNull()
     })
 
+    it('dynamic', function (done) {
+      var vm = new Vue({
+        el: el,
+        data: {
+          id: 'test'
+        },
+        template: '<div v-el="{{id}}" id="test"></div>'
+      })
+      expect(vm.$$.test).toBeTruthy()
+      expect(vm.$$.test.id).toBe('test')
+      vm.id = 'changed'
+      _.nextTick(function () {
+        expect(vm.$$.test).toBeNull()
+        expect(vm.$$.changed).toBeTruthy()
+        expect(vm.$$.changed.id).toBe('test')
+        done()
+      })
+    })
+
     it('normal (new syntax)', function (done) {
       var vm = new Vue({
         el: el,

test/unit/specs/directives/ref_spec.js

@@ -26,7 +26,7 @@ if (_.inBrowser) {
         data: {
           ref: 'test2'
         },
-        template: '<test ref="test"></test><test2 bind-ref="ref"></test2>'
+        template: '<test $.test></test><test2 v-ref="{{ref}}"></test2>'
       })
       expect(vm.$.test).toBeTruthy()
       expect(vm.$.test.$options.id).toBe('test')
@@ -39,7 +39,7 @@ if (_.inBrowser) {
         el: el,
         components: components,
         data: { test: 'test' },
-        template: '<component bind-is="test" ref="test"></component>'
+        template: '<component bind-is="test" $.test></component>'
       })
       expect(vm.$.test.$options.id).toBe('test')
       vm.test = 'test2'
@@ -57,7 +57,7 @@ if (_.inBrowser) {
       var vm = new Vue({
         el: el,
         data: { view: 'one' },
-        template: '{{$.test.value}}<component bind-is="view" ref="test"></component>',
+        template: '{{$.test.value}}<component bind-is="view" $.test></component>',
         components: {
           one: {
             id: 'one',
@@ -96,7 +96,7 @@ if (_.inBrowser) {
         el: el,
         template:
           '<div>' +
-            '<comp ref="out">{{$.out.msg}}</comp>' +
+            '<comp $.out>{{$.out.msg}}</comp>' +
           '</div>',
         components: {
           comp: {