Shulou(Shulou.com)06/01 Report--

This article editor for you detailed introduction of "vue filter filters can not get the this object how to do", the content is detailed, the steps are clear, the details are handled properly, I hope this "vue filter filters can not get this object how to do" article can help you solve doubts, the following follow the editor's ideas slowly in-depth, together to learn new knowledge bar.

The principle that vue filter filters can not get this object

Define an attribute that in data to store this in that

Just pass the that in when you call the method sum in filters

Here's an example.

Using filters to calculate the value of astatb in data

Note: the first parameter of the sum method in filters is | the an on the left, and the second parameter is the that written in parentheses

{{a | sum (that)} export default {name: "test", data () {return {that: this, a: 1, b: 2}}, filters: {sum (a, that) {console.log (that); return a + that.b }},} Vue filters this points to the problem filter in the Vue instance does not depend on the current vue instance context

So there is no direct access to the current vue instance in filter, so you can use computed instead.

However, when it comes to the need to change according to the html text, v-for data and so on, the function of computed can not meet our needs.

Then we can use methods instead.

Data: {shopItemType: {}}, methods: {shopItemType2str (id) {return this.shopItemType [id] } {{shopItemType2str (shopItem.item_type)}} here, the article "what if the vue filter filters cannot get the this object" has been introduced. If you want to master the knowledge points of this article, you still need to practice and use it before you can understand it. If you want to know more related articles, please follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.