时间戳

首页 > 解决方案 > onClick 属性和函数是否暴露在 react-select 上？

reactjs - onClick 属性和函数是否暴露在 react-select 上？

问题描述

我想延迟 react-select 的选项元素上的 onClick 事件。

例子：

import React from "react";
import { components } from "react-select";

const Option = props => {
  const { label, data, onClick } = props;

  return (
    <components.Option
      {...props}
      onClick={() => {
        setTimeout(onClick, 100);
      }}>
      <div>Some custom stuff here</div>
    </components.Option>
  );
};

export default Option;

预期行为：

  1. 用户点击选项（在下拉列表中）
  2. react-select 不应该在 100ms 内做任何事情
  3. 100 毫秒后 react-select 完成他的工作

我已经用 props selectOption, onChange, 和and组件尝试过这个onClick ，但是没有用。Selectcomponents.Options

标签： reactjsreact-select

解决方案

找到它:)
不确定它是否正确，但它有效。

  const { innerProps } = props;
  const { onClick } = innerProps;
  props.innerProps.onClick = e => {
    setTimeout(() => {
      onClick(e);
    }, 100);
  };

推荐阅读