Vuejs2 - 如何将两个数组中的元素与计算属性进行比较？

Posted 2023-02-23

【中文标题】Vuejs2 - 如何将两个数组中的元素与计算属性进行比较？

【英文标题】：Vuejs2 - How to compare elements in two array with computed properties?

【发布时间】：2020-04-12 18:23:12

【问题描述】：

我正在研究用于比较两个数组的计算函数...一个 keywords 在数据中，另一个由计算 keywords_list 返回。当计算比较时，他不会在第一个数组中接受 Axios 之前的计数值...... 我不知道该怎么办......

我的代码：

    beforeCreate() 
            this.$axios(
                method: 'get',
                url: '/api/rest/alerts/'
            ).then(response => 
                if ((response.data.keywords.length == 0) && (response.data.countries.length == 0)) 
                    this.alertEmpty = 'Aucune alerte de créée'
                 else 
                    this.alert = response.data
                    this.keywords = response.data.keywords
                    this.countriesKeywords = response.data.countries
                    this.allSectorsSelected = response.data.all_sectors
                
            )
        ,

        data() 
            return 
                categories: "",
                alert: '',
                alertEmpty: '',
                countriesKeywords: [],
                countrySelected: '',
                keywords: [],
                update: false,
                sectorSelected: "",
                alerts: [],
                keywordSelected: "",
                errorKeyword: '',
                successModification: '',
                allSectorsSelected: null,

            ;
        ,

        computed: 
            keywords_list: function() 
                for (var i = 0; i < this.sectors.length; i++) 
                    if (this.sectors[i].id == this.sectorSelected) 
                        return this.sectors[i].keywords;
                    
                
            ,
            allKeywordsInSector: function() 
                if (this.keywords_list.every(item => this.keywords.indexOf(item) >= 0)) 
                    return true;
                
                return false;
            ,
        

感谢您的帮助

【问题讨论】：

您的 keywords 变量在您从 api 获取数据后如何处理？

她正在寻找关键字：[31]

里面有 31 个对象

但是如果我在里面添加所有的关键字再次计算把这个计数

当条件this.sectors[i].id == this.sectorSelected 失败时，您的计算属性keywords_list 可能是undefined。 this.sectors 来自哪里？我在您的数据对象或 API 调用中看不到它。如果keywords_list 是undefined，那么allKeywordsInSector 的计算函数可能会出错

【参考方案1】：

信息很少，并且不清楚 api 结果如何影响您的计算值 我只能说，Vue 中的属性没有反应性。所以如果sections 不是静态的，计算属性sectorSelected 只会在sectorSelected 改变时改变

https://vuejs.org/v2/guide/components-props.html#One-Way-Data-Flow

【讨论】：

嘿，谢谢你的回答！是的，我已经尝试了很多事情，而且问题不是来自部门...我在sector_selected 上创建了一个手表，并且出现了console.log，但是条件不起作用，如果我删除所有旧关键字并添加新闻关键字没问题...我不明白为什么...看起来数组中的旧关键字没有计算在内...