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

发布于 2025-01-18 14:58:53 字数 1577 浏览 2 评论 0原文

在与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" }

数据被轴心获取,并将Usestate Inside in usestate in usesteft中:

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"});

一切似乎都正确,但是当我单击下拉菜单时,屏幕会变白,并且已记录了控制台:


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

我在当前的项目中有很多下拉列表,它们是一切都很好。有人可以看到问题吗?

While working with Kendo React, I wanted to add a Kendo DropDownList. I tried to fill the list with data like this:

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" }

The data is fetched with axios and put inside useState in UseEffect:

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);
        }
      })();
     
       }, []);

So, 'sektor' is used as an array of objects that will fill the Kendo dropdown:

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

'sektorV' is a state that saves the object that is picked from the KendoDropDown and is defined like this:

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

Everything seems to be correct, but when I click on the DropDown the screen goes white and this is console logged:


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

I had a bunch of dropdowns in my current project and they all worked fine. Can anybody see the problem?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

絕版丫頭 2025-01-25 14:58:53

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

尝试setSektor(ressektor.data.rlista.slice(1));删除null null null update 元素的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);
    }
  })();
}, []);

Just a hunch based on this limited code context, but I think this error is thrown because the first element has a null name property in the resSektor.data.rlista array.

Try setSektor(resSektor.data.rlista.slice(1)); to remove the null value or instead of null update that element's name property to "ALL" to match the initial sectorV state.

useEffect(() => {   
  (async() =>{
    try {
      const resSektor = await services.getSektor();
      resSektor.data.rlista[0].name = "All";
      setSektor(resSektor.data.rlista);
    } catch(e) {
      console.log(e);
    }
  })();
}, []);
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文