javascript computed includes在Vue.js中不起作用,怎么修?

pjngdqdw  于 2023-08-02  发布在  Java
关注(0)|答案(1)|浏览(109)

我想在Vue中使用“includes”来处理我的v-model和Vue.js日志错误,但是如果我写(.includes(“blabla))->就好了。
问题是什么?
如何返回所有数组if(if)?
像这样.emojiesByCategory.push()?
请帮帮忙

<template>
    <div id="app">
        <div class="emoji_picker">
            <div class="picker_container">
                <input v-model="search">
                <div class="category"
                     v-for="category in categories"
                     :key="`category_${category}`"
                >
                    <span>{{ category }}</span>
                    <div class="emojis_container">
                        <button
                            v-for="(emoji, index) in category_emojis(category)" // ERROR HERE
                            :key="`emoji_${index}`"
                        >
                            {{ emoji }}
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import data from '../data.json'

export default {
    name: 'App',
    data() {
        return {
            search: "",
            emojiesByCategory: ""
        }
    },
    computed: {
        categories() {
            return Object.keys(data);
        },

        category_emojis: () => (category) => {
            for (let i = 0; i < Object.keys(data[category]).length; i++) {
                if (Object.keys(data[category])[i].includes(this.search)) { // ERROR THERE !!!
                    console.log(Object.values(data[category])[i]) 
            }
            return Object.values(data[category])
        }
    },
}
</script>


// how fix  this?

字符串
我的json的样子:

{
    "Frequently used": {
        "confused": "😕",
        "neutral_face": "😐",
        "blush": "😊",
        "heart_eyes": "😍"
    },
    // and others
}


请帮帮我

piok6c0g

piok6c0g1#

如果在computed属性中使用arrow函数,您将无法访问this.search。当你在arrow函数中使用this.search时,它不是指Vue示例的data属性搜索,而是指父作用域中的this(在浏览器中可能是window),其中搜索可能是undefined
简单的定义:

category_emojis() {
    return (category) => {
        let filteredEmojis = {};

        for (let emoji in data[category]) {
            if (emoji.includes(this.search)) {
                filteredEmojis[emoji] = data[category][emoji];
            }
        }

        return Object.values(filteredEmojis);
    }
}

字符串
另外,请注意,您最初在data中将emojiesByCategory初始化为string。也改成array

相关问题