vue-select Error in getter for watcher "filteredOptions": "TypeError: e[t.label].toLowerCase is n

cominglately

于 2018-08-18 23:34:28 发布

阅读量8.9k

点赞数

CC 4.0 BY-SA版权

分类专栏： vue 文章标签： vue vue-select

本文链接：https://blog.youkuaiyun.com/cominglately/article/details/81814217

vue 专栏收录该内容

41 篇文章

订阅专栏

本文介绍了在使用vue-select组件时遇到的问题：当选项标签为纯数字时，组件初始化会报错。通过修改数字标签为字符串形式成功解决了该问题。

场景

sagalbot/vue-select 在组件初始化的时候报的错

Error in getter for watcher “filteredOptions”: “TypeError: e[t.label].toLowerCase is n

下面的是vue-select的相关信息

 <v-select :options="list_level" v-model="level" :placeholder="placeholder_level"></v-select>

list_level: [
{label: 1, value: 1},
{label: 2, value: 2},
{label: 3, value: 3},
{label: 4, value: 4},
]

分析

哈, 检查了传递的属性，最后锁定出问题的地方, list_level 但是这个数据本身上没有没啥问题的, then求助chrome

解决

sagalbot/vue-select 项目issue中给出了官方答案
- options label不可以有纯数字的单元
所以解决方法如下

               list_level: [
                        {label: '1', value: 1},
                        {label: '2', value: 2},
                        {label: '3', value: 3},
                        {label: '4', value: 4},
                ],