Javascript e、 在reactjs中未定义target.value

当用户单击

li

标记时，我试图记录它的值。但不知怎的，当我点击

li

时，它抛出了一个错误。

TypeError:无法读取未定义的属性“target”

我想我在将事件处理程序作为道具传递时遇到了问题

这是父组件

const Category = props => {
  const dispatch = useDispatch();
  let [value, setValue] = useState("choose");
  let clickHandler = e => {
    console.log(e.target.value);
    dispatch({
      type: ADD_CATEGORY,
      payload: value
    });
  };
  return (
    <div className="part">
      <h3 className="cat">category</h3>
      <Options
        items={["one", "two", "three"]}
        name="category"
        clickHandler={clickHandler}
        value={value}
      />
    </div>
  );
};

const Category=props=>{
const dispatch=usedpatch（）；
让[value，setValue]=useState（“选择”）；
让clickHandler=e=>{
console.log（如target.value）；
派遣({
类型：添加_类别，
有效载荷：值
});
};
返回(
类别
);
};

孩子来了

const Options = props => {
  let [expanded, setExpanded] = useState(false);
  let clickHandler = () => {
    props.clickHandler();
    setExpanded(false);
  };
  return (
    <div className="options-container">
      <button
        className="option-head"
        onClick={() => setExpanded(!expanded)}
        value={props.value}
      >
        {props.value}
      </button>
      <ul className={expanded ? "options expanded" : "options not-expanded"}>
        <li className="ul-title" onClick={() => setExpanded(false)}>
          {props.name}
        </li>
        {props.items.map((item, index) => (
          <li key={index} onClick={clickHandler} value={item}>
            <p value={item}>{item}</p>
          </li>
        ))}
      </ul>
    </div>
  );
};

const Options=props=>{
let[expanded，setExpanded]=useState（false）；
让clickHandler=（）=>{
props.clickHandler（）；
设置扩展（假）；
};
返回(
setExpanded（！expanded）}
value={props.value}
>
{props.value}

setExpanded（false）}>
{props.name}

{props.items.map（（项目，索引）=>(

{item}


))}

);
};

---

谢谢大家!

请按以下方式更改您的代码

const Category=props=>{
const dispatch=usedpatch（）；
让[value，setValue]=useState（“选择”）；
让clickHandler=项目=>{
控制台日志（项目）；
派遣({
类型：添加_类别，
有效载荷：值
});
};
返回(
类别
);
};
常量选项=道具=>{
let[expanded，setExpanded]=useState（false）；
让clickHandler=（项目）=>{
道具。点击处理程序（项目）；
设置扩展（假）；
};
返回(
setExpanded（！expanded）}
value={props.value}
>
{props.value}

setExpanded（false）}>
{props.name}

{props.items.map（（项目，索引）=>(
clickHandler（item）}value={item}>
{item}


))}

);
};

如果您想要console.log中

项的值，我在帖子中做了一些编辑，这可能会有所帮助。