hook中传递参数的操作最优雅的方式究竟是什么?
1 .感觉data-value设置自定义属性就可以不用每次创建新函数了.但是为什么取不到值呢
image.png
2 .看图这里明明已经绑定上去了,但是实际上根本不行啊,有的按钮可以获取到,有的就不行了
3 .但是这种方式我css是匹配完全没有问题的.
{Object.values(newSkill).map((e)=>{
return <Button
color="#2db7f5"
style={{width:150}}
title={e[5]}
key={e[0]}
className="zhanfa_tag"
data-search={e[5]}
data-value={e[0]}
//绑定是完全没问题的,我在浏览器的dom里面都有看到
onClick={handleZhanfaChoose}
>
{e[1]}
</Button>
})}
let value=id.target.getAttribute('data-value')
console.log(value,'设置的值')
//获取这里就是有的属性可以获取到,有的属性获取不到,而且是大部分是获取不到的
做一个简单的demo是可以的
const numbers=[]
for(let i=0;i<1000;i++){
numbers.push(i)
}
function handleClick(e){
console.log(e.target.getAttribute('value'))
}
const listItems = numbers.map((numbers) =>
<li key={numbers} onClick={handleClick} value={numbers}>{numbers}</li>
);
2 .还原一下数据,现在的数据结构还是比较简单的.2000个数据,每个数据有20多项
3 .我擦,竟然是ant design的组件的bug,我干,不使用<Button></Button>组件,用原生的就是可以的.我真是干了.用别人的组件真的到处都是坑坑,坚决不用组件.感觉hook才是组件复用的终极形式.
