Skip to content

Commit

Permalink
improve class interpoations (fix vuejs#1960)
Browse files Browse the repository at this point in the history
  • Loading branch information
yyx990803 committed Dec 4, 2015
1 parent a4cfd2b commit ad2ac50
Show file tree
Hide file tree
Showing 5 changed files with 30 additions and 6 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@
"build": "node build/build.js",
"install-hook": "ln -s ../../build/git-hooks/pre-commit .git/hooks/pre-commit",
"dev": "webpack --watch --config build/webpack.dev.config.js & npm run serve-test",
"serve-test": "webpack-dev-server --config build/webpack.test.config.js",
"serve-test": "webpack-dev-server --config build/webpack.test.config.js --host 0.0.0.0",
"build-test": "webpack --config build/webpack.test.config.js",
"lint": "eslint src/** test/e2e/** test/unit/specs/** build/**.js",
"e2e": "casperjs test --concise ./test/e2e",
Expand Down
8 changes: 6 additions & 2 deletions src/compiler/compile.js
Original file line number Diff line number Diff line change
Expand Up @@ -652,8 +652,12 @@ function compileDirectives (attrs, options) {
// attribute interpolations
if (tokens) {
value = tokensToExp(tokens)
arg = name
pushDir('bind', publicDirectives.bind, true)
if (name === 'class') {
pushDir('class', internalDirectives['class'], true)
} else {
arg = name
pushDir('bind', publicDirectives.bind, true)
}
// warn against mixing mustaches with v-bind
if (process.env.NODE_ENV !== 'production') {
if (name === 'class' && Array.prototype.some.call(attrs, function (attr) {
Expand Down
11 changes: 10 additions & 1 deletion src/directive.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import {
warn
} from './util/index'
import Watcher from './watcher'
import { removeTags } from './parsers/text'
import { parseExpression, isSimplePath } from './parsers/expression'

function noop () {}
Expand Down Expand Up @@ -82,7 +83,15 @@ Directive.prototype._bind = function () {
this.el && this.el.removeAttribute
) {
var attr = descriptor.attr || ('v-' + name)
this.el.removeAttribute(attr)
if (attr !== 'class') {
this.el.removeAttribute(attr)
} else {
// for class interpolations, only remove the parts that
// need to be interpolated.
this.el.className = removeTags(this.el.className)
.trim()
.replace(/\s+/g, ' ')
}
}

// copy def properties
Expand Down
11 changes: 11 additions & 0 deletions src/parsers/text.js
Original file line number Diff line number Diff line change
Expand Up @@ -159,3 +159,14 @@ function inlineFilters (exp, single) {
}
}
}

/**
* Replace all interpolation tags in a piece of text.
*
* @param {String} text
* @return {String}
*/

export function removeTags (text) {
return text.replace(tagRE, '')
}
4 changes: 2 additions & 2 deletions test/unit/specs/compiler/compile_spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -516,12 +516,12 @@ describe('Compile', function () {
}
})
expect(el.firstChild.id).toBe('aaa')
expect(el.firstChild.className).toBe('b ccc d')
expect(el.firstChild.className).toBe('b d ccc')
vm.a = 'aa'
vm.c = 'cc'
_.nextTick(function () {
expect(el.firstChild.id).toBe('aa')
expect(el.firstChild.className).toBe('b cc d')
expect(el.firstChild.className).toBe('b d cc')
done()
})
})
Expand Down

0 comments on commit ad2ac50

Please sign in to comment.