search

vuejs / vue

This is the repo for Vue 2. For Vue 3, go to https://github.com/vuejs/core
http://v2.vuejs.org
MIT License
208.01k stars 33.69k forks source link

Filter not recognized when filtered value contains a '/' #4415

Closed adriaanzon closed 7 years ago

adriaanzon commented 7 years ago

Vue.js version

2.1.x

Works fine in 2.0.x

Reproduction Link

https://jsbin.com/fuxitojugu/edit?html,console,output

Steps to reproduce

Divide a number using the / operator, then apply a filter to it.

{{ price / 100 | currency }}

What is Expected?

This divided number gets filtered, just like with other arithmetic operators.

What is actually happening?

Get this error:

"[Vue warn]: Property or method \"currency\" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option.

"currency" is the name of the filter here, but it got recognized as a property or keyword, not as a filter.

I think, as of this commit https://github.com/vuejs/vue/commit/38b8cfdf967ac684883e3356ce8277e9334f0522, the expression gets recognized as a regular expression because it contains a /.

LinusBorg commented 7 years ago

As a quick workaround: {{ (price / 100) | currency }}works.