Skip to content

Commit 6725827

Browse files
committed
bring back attribute interpolation
1 parent 832f688 commit 6725827

File tree

2 files changed

+62
-3
lines changed

2 files changed

+62
-3
lines changed

src/compiler/compile.js

+12-3
Original file line numberDiff line numberDiff line change
@@ -555,11 +555,20 @@ function makeTerminalNodeLinkFn (el, dirName, value, options, def) {
555555
function compileDirectives (attrs, options) {
556556
var i = attrs.length
557557
var dirs = []
558-
var attr, name, value, dirName, arg, dirDef, isLiteral
558+
var attr, name, raw, value, dirName, arg, dirDef, isLiteral, tokens
559559
while (i--) {
560560
attr = attrs[i]
561561
name = attr.name
562-
value = attr.value
562+
raw = value = attr.value
563+
564+
// attribute interpolations
565+
if (tokens = textParser.parse(value)) {
566+
value = textParser.tokensToExp(tokens)
567+
pushDir('bind', publicDirectives.bind, {
568+
arg: name,
569+
interp: true
570+
})
571+
} else
563572

564573
// special attribute: transition
565574
if (transitionRE.test(name)) {
@@ -639,7 +648,7 @@ function compileDirectives (attrs, options) {
639648
var dir = {
640649
name: dirName,
641650
attr: name,
642-
raw: value,
651+
raw: raw,
643652
def: def,
644653
expression: parsed.expression,
645654
filters: parsed.filters

src/directives/public/bind.js

+50
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
var _ = require('../../util')
2+
13
// xlink
24
var xlinkNS = 'http://www.w3.org/1999/xlink'
35
var xlinkRE = /^xlink:/
@@ -23,6 +25,7 @@ module.exports = {
2325
priority: 850,
2426

2527
update: function (value) {
28+
if (this.invalid) return
2629
var attr = this.arg
2730
if (inputProps[attr] && attr in this.el) {
2831
if (!this.valueRemoved) {
@@ -46,3 +49,50 @@ module.exports = {
4649
}
4750
}
4851
}
52+
53+
if (process.env.NODE_ENV !== 'production') {
54+
module.exports.bind = function () {
55+
var attr = this.arg
56+
// handle interpolation bindings
57+
if (this.descriptor.interp) {
58+
var raw = attr + '="' + this.descriptor.raw + '": '
59+
// only allow binding on native attributes
60+
if (
61+
// data attributes are allowed
62+
!(/^data-/.test(attr)) &&
63+
// class is allowed
64+
!(attr === 'class') &&
65+
(
66+
// label for
67+
(attr === 'for' && !('htmlFor' in this.el)) ||
68+
// other native attributes
69+
!(_.camelize(attr) in this.el)
70+
)
71+
) {
72+
_.warn(
73+
raw + 'attribute interpolation is allowed only ' +
74+
'in valid native attributes. "' + attr + '" ' +
75+
'is not a valid attribute on <' + this.el.tagName.toLowerCase() + '>.'
76+
)
77+
this.invalid = true
78+
}
79+
80+
// warn src
81+
if (attr === 'src') {
82+
_.warn(
83+
raw + 'interpolation in "src" attribute will cause ' +
84+
'a 404 request. Use v-bind:src instead.'
85+
)
86+
}
87+
88+
// warn style
89+
if (attr === 'style') {
90+
_.warn(
91+
raw + 'interpolation in "style" attribtue will cause ' +
92+
'the attribtue to be discarded in Internet Explorer. ' +
93+
'Use v-bind:style instead.'
94+
)
95+
}
96+
}
97+
}
98+
}

0 commit comments

Comments
 (0)