未捕获类型错误:r.current.contains不是kendo DriopDownList中的函数



在使用Kendo React时,我想添加一个Kendo DropDownList。我试着用这样的数据填充列表:

Array(8) [ {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…} ]
​
0: Object { id: -1, name: null }
​
1: Object { id: 1, name: "A" }
​
2: Object { id: 2, name: "B" }
​
3: Object { id: 3, name: "C" }
​
4: Object { id: 4, name: "D" }
​
5: Object { id: 5, name: "E" }
​
6: Object { id: 6, name: "F" }
​
7: Object { id: 77, name: "G" }

使用axios获取数据,并将其放入UseEffect:中的useState

const[sektor, setSektor] = useState([]);
...
...
useEffect(() => {   
(async() =>{
try{
const resSektor = await services.getSektor();
console.log(resSektor.data.rlista); //JSON above is this console log
setSektor(resSektor.data.rlista);
}
catch(e){
console.log(e);
}
})();

}, []);

因此,"sektor"被用作填充Kendo下拉列表的对象数组:

<DropDownList data={sektor} value={sektorV} style={{marginTop:'2%'}} onChange={handleChangeSektor} textField="name" dataItemKey="id"/>
...
...
const handleChangeSektor = (event) => {
setSektorV(event.target.value);
};

"sektorV"是一种保存从KendoDropDown中拾取的对象的状态,定义如下:

const[sektorV, setSektorV] = useState({id: -1, name: "All"});

一切似乎都是正确的,但当我点击DropDown时,屏幕会变白,这是控制台记录的:


Uncaught TypeError: r.current.contains is not a function
...
Uncaught TypeError: _utils__WEBPACK_IMPORTED_MODULE_2__.getItemValue(...) is null

在我目前的项目中,我遇到了很多挫折,他们都做得很好。有人看到问题了吗?

只是基于这个有限的代码上下文的预感,但我认为这个错误是因为第一个元素在resSektor.data.rlista数组中具有nullname属性。

请尝试setSektor(resSektor.data.rlista.slice(1));删除null值,或者将元素的name属性更新为"ALL"以匹配初始sectorV状态,而不是null

useEffect(() => {   
(async() =>{
try {
const resSektor = await services.getSektor();
resSektor.data.rlista[0].name = "All";
setSektor(resSektor.data.rlista);
} catch(e) {
console.log(e);
}
})();
}, []);

相关内容

  • 没有找到相关文章

最新更新