首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >Vue.js如何修复错误:未捕获TypeError: data.filter不是我代码中的函数?

Vue.js如何修复错误:未捕获TypeError: data.filter不是我代码中的函数?
EN

Stack Overflow用户
提问于 2019-02-20 03:48:28
回答 2查看 1.3K关注 0票数 1

我在json中有一个这样的结构:

代码语言:javascript
复制
    itens: {"countcats":2,"countsubcats":7,
            "catsubcatsdata":{
                "15978738e6cd1e":{"title":"Test 1","description":"blablabla",
                    "subcats":{
                        "1597873b1653d9": {"codurl":"t01url","title":"Teste subiten 1","description":""},
                        "1597873bd76c80": {"codurl":"t01url2","title":"Testing sub two","description":""},
                        "1597873c9d4a81": {"codurl":"t01url3","title":"Test sub 3","description":"blablabla 01"},
                        }},
                "15978745b32c1b":{"title":"Loren Ipsun","description":"lamet dectoid samet",
                    "subcats":{
                        "159787464bc887":{"codurl":"maecenas","title":"Maecenas pulvinar","description":"orci non volutpat varius"},
                        "159787472eb5e6":{"codurl":"donecorci ","title":"Donec hendrerit orci","description":""},
                        "15978748b89bca":{"codurl":"massadictum","title":"Nullam eu massa dictum", "description":""},
                        "159787495492f4":{"codurl":"ultricies","title":"Etiam massa arcu","description":"Donec ultricies porttitor augue quis dictum. Quisque efficitur nec sapien eu ultricies"}
                        }}
                }}

我有以下代码:

代码语言:javascript
复制
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="v-for-sectors">
	<input type="text" placeholder="Search" v-model="searchQuery">

  <ul>
    <li v-for="(value, key) in filteredList">
          <b>{{ value.title }}</b><br>{{ value.description }}
			<ul>
			  <li v-for="(vsub, keysub) in value.subcats"><a v-bind:href="'http://www.teste.com/'+vsub.codurl">{{ vsub.title }} - {{ vsub.description }}</a></li>
			</ul>
    </li>
  </ul>
</div>

<script>
    new Vue({
        el: '#v-for-sectors',
        data: {
            searchQuery: '',
            itens: {"catsubcatsdata":{"15978738e6cd1e":{"title":"Test 1","description":"blablabla","subcats":{"1597873b1653d9":{"codurl":"t01url","title":"Teste subiten 1","description":""},"1597873bd76c80":{"codurl":"t01url2","title":"Testing sub two","description":""},"1597873c9d4a81":{"codurl":"t01url3","title":"Test sub 3","description":"blablabla 01"}}},"15978745b32c1b":{"title":"Loren Ipsun","description":"lamet dectoid samet","subcats":{"159787464bc887":{"codurl":"maecenas","title":"Maecenas pulvinar","description":"orci non volutpat varius"},"159787472eb5e6":{"codurl":"donecorci","title":"Donec hendrerit orci","description":""},"15978748b89bca":{"codurl":"massadictum","title":"Nullam eu massa dictum","description":""},"159787495492f4":{"codurl":"ultricies","title":"Etiam massa arcu","description":"Donec ultricies porttitor augue quis dictum."}}}}}
		},
        computed: {
            filteredList: function () {
              var filterKey = this.searchQuery && this.searchQuery.toLowerCase()
              var data = this.itens.catsubcatsdata
				if (filterKey) {
					data = data.filter(function (row) {
                              return Object.keys(row).some(function (key) {
                                return String(row[key]).toLowerCase().indexOf(filterKey) > -1
                              })
							})
				}
                return data
            }
        }
    });
</script>

我试着遵循这个例子的逻辑:https://br.vuejs.org/v2/examples/grid-component.html

但我不明白您为什么返回以下错误:data.filter is not a function"

我想搜索所有标题和描述的项目和子项目。

谁能给我解释一下我哪里错了,正确的方法是什么?

EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/54773897

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档