Skip to content

Commit cfd1221

Browse files
committed
support filters inside props
1 parent 95cc32e commit cfd1221

File tree

3 files changed

+33
-2
lines changed

3 files changed

+33
-2
lines changed

src/compiler/compile-props.js

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
var _ = require('../util')
2+
var dirParser = require('../parsers/directive-new')
23
var textParser = require('../parsers/text')
34
var propDef = require('../directives/prop')
45
var propBindingModes = require('../config')._propBindingModes
@@ -24,7 +25,7 @@ var literalValueRE = /^(true|false)$|^\d.*/
2425
module.exports = function compileProps (el, propOptions) {
2526
var props = []
2627
var i = propOptions.length
27-
var options, name, attr, value, path, prop, literal, single
28+
var options, name, attr, value, path, prop, literal, single, parsed
2829
while (i--) {
2930
options = propOptions[i]
3031
name = options.name
@@ -108,7 +109,9 @@ module.exports = function compileProps (el, propOptions) {
108109
// mark it so we know this is a bind
109110
prop.bindSyntax = true
110111
el.removeAttribute(attr)
111-
value = value.trim()
112+
parsed = dirParser.parse(value)
113+
value = parsed.expression
114+
prop.filters = parsed.filters
112115
// check binding type
113116
if (literalValueRE.test(value)) {
114117
prop.mode = propBindingModes.ONE_TIME

src/directives/prop.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ module.exports = {
2727
}
2828
}, {
2929
sync: true,
30+
filters: prop.filters,
3031
// important: props need to be observed on the
3132
// repeat scope if present
3233
scope: this._scope

test/unit/specs/directives/prop_spec.js

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -524,5 +524,32 @@ if (_.inBrowser) {
524524
})
525525
expect(_.warn).not.toHaveBeenCalled()
526526
})
527+
528+
it('new syntax with filters', function (done) {
529+
var vm = new Vue({
530+
el: el,
531+
template: '<test bind-name="a | test"></test>',
532+
data: {
533+
a: 123
534+
},
535+
filters: {
536+
test: function (v) {
537+
return v * 2
538+
}
539+
},
540+
components: {
541+
test: {
542+
props: ['name'],
543+
template: '{{name}}'
544+
}
545+
}
546+
})
547+
expect(el.textContent).toBe('246')
548+
vm.a = 234
549+
_.nextTick(function () {
550+
expect(el.textContent).toBe('468')
551+
done()
552+
})
553+
})
527554
})
528555
}

0 commit comments

Comments
 (0)