如何解决React useRef 值修改了两次
我对 React 很陌生,并尝试使用 useRef 将当前选定的项目存储在列表中。它是一个 AutoCompleteDialog
,组件在其中获取所有可用项目、过滤器字符串、打开状态、位置和 selectionMove 事件。
keydown
事件在父组件中捕获,此事件通过 AutoCompleteDialog
属性传播到 selectionMove
。
export const AutoCompleteDialog = ({items,filter,open=false,top=0,left=0,selectionMove={dir:0}}) => {
const position = {top: top,left:left};
const selectedindex = useRef({idx:0});
console.log('Render');
if (selectionMove.dir === -1) {
selectedindex.current.idx = selectedindex.current.idx + 1;
} else if (selectionMove.dir === 1) {
selectedindex.current.idx = selectedindex.current.idx - 1;
}
console.log('index: ' + selectedindex.current.idx);
我的问题是组件似乎将 useRef 变量增加了两次。 “Render”字符串显示一次,但索引值增加了2而不是1。
...
Render
index: 7
Render
index: 9
Render
index: 11
我已经删除了 selectedindex
的所有其他用法,但它仍然算作两个。
可能是什么问题?
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。