vue 如何实现在filters下的方法中获取到data中变量

原因:filters中的this指向的并不是vue实例

通过以下方式:可以实现filters中获取到data的变量

1: 定义全局变量 _this (let _this = this)
2: beforeCreate() { _this = this; } //将 this 赋值给_this
3: filters下的方法可以直接使用_this.data来获取到data中的变量

<template>
  <div>{{ status | filtTest }}</div>
</template>

<script type="text/ecmascript-6">
    let _this = this   //**定义全局变量**
    export default { 
      data(){
        statusDatas: [
          { value: 1, name: '对' },
          { value: 2, name: '否' }
         ]
      },
      beforeCreate() {
        _this = this; //**  赋值 **
      },
      filters: {
        filtTest(value) {
          let newName = ''
          _this.statusDatas.forEach(item => { //**  直接获取使用 **
            if(item.value === value) {
              return newName = item. name
            }
          })
          return newName
        }
      }
    }
</script>
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • # Vue.js - day01 ## 插件安装推荐 vscode有二个常用插件:vetur,Vue 2 Snip...
    wuyuan0127阅读 600评论 0 0
  • 张现发项目实战三-----月度总结 微信小程序: (1)项目流程 1、首先要注册一个微信小程序的账号 2、获取我们...
    北奶_92f8阅读 1,140评论 0 1
  • 1.说说对双向绑定的理解 1.1、双向绑定的原理是什么 我们都知道Vue是数据双向绑定的框架,双向绑定由三个重要部...
    GuessYe阅读 506评论 0 0
  • VUE.js 基本命令v-if || v-for : 条件与循环v-model: 为页面输入框进行数据双向绑定v-...
    楼水流云阅读 666评论 0 0
  • 一、概念介绍 Vue.js和React.js分别是目前国内和国外最火的前端框架,框架跟类库/插件不同,框架是一套完...
    刘远舟阅读 1,089评论 0 0