时间戳

首页 > 解决方案 > vue js将地图过滤器转换为变量

vue.js - vue js将地图过滤器转换为变量

问题描述

const managers = new Map([

    ['CA1111@domain.com', 'myuser@domain.com'],
    ['SA5363@domain.com', 'auser@domain.com'],
    ['EA6373@domain.com', 'theuser@domain.com']


    ])
    
    Vue.filter('managers', function(value)  {   
                return (value != null ? managers.get(value.substring(0, 10)) : "") || 'Unknown' 
            })

我正在使用 vue 2.5，并且我有一个 .map 过滤器用于指向用户的特定电子邮件地址。问题是-我希望能够以可变格式指出这一点，并且我试图找出实现这一目标的最佳方法。因此，由于“过滤器”，屏幕上会显示正确的电子邮件地址，但我需要将其推送到变量中吗？

{{sillystring | manager}}

标签： vue.js

解决方案

你不需要 afilter来得到那个结果。如果filter您希望您的代码面向未来（Vue3 删除了filters：https ://dev.to/chenxeed/awesome-break-changes-in-vue-3-if-you-从 vue-2-3b98 迁移）

const managers = new Map([
  ['CA1111@domain.com', 'myuser@domain.com'],
  ['SA5363@domain.com', 'auser@domain.com'],
  ['EA6373@domain.com', 'theuser@domain.com']
])

Vue.filter('managers', function(value) {
  return (value != null ? managers.get(value.substring(0, 17)) : "") || 'Unknown'
})

new Vue({
  el: "#app",
  data: {
    managerList: []
  },
  methods: {
    managers(value) {
      // putting the values into a list
      if (!this.managerList.includes(value)) {
        this.managerList = [...new Set([...this.managerList, value])]
      }

      // returning value like a filter
      return (value != null ? managers.get(value.substring(0, 17)) : "") || 'Unknown'
    }
  }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
  "managers" filter: {{ "SA5363@domain.com" | managers }}<br />
  "managers" method: {{ managers("SA5363@domain.com") }}<br />
  "managers" method: {{ managers("EA6373@domain.com") }}<br />
  "managerList" attribute: {{ managerList }}
</div>

实际上，您的示例代码不起作用，因为您希望 avalue的Map长度substring为 10，但Map' 的键长为 17 个字符。也许这只是因为这个例子，但我必须纠正它才能使片段工作。

推荐阅读