Uncaught TypeError: r.current.contains is not a function in kendo DriopDownList

Question

在使用 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

我当前的项目中有很多下拉菜单，它们都运行良好。有人能看出问题吗？

Answer 1

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

尝试 setSektor(resSektor.data.rlista.slice(1)); 删除 null 值或代替 null 更新 that 元素的 name 属性到 "ALL" 以匹配初始 sectorV 状态。

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

Uncaught TypeError: r.current.contains is not a function in kendo DriopDownList

Uncaught TypeError: r.current.contains is not a function in kendo DriopDownList

javascript

kendo-ui

reactjs

kendo-dropdown