通过forwardRef传递道具

我有一个名为“时间轴”的组件,在该组件的内部,有一个按钮,该按钮的onClick调用了名为handleSpeed(e)的方法,该方法发送其属性,即用户在按钮上设置的速度就这样改变玩家的速度。

    <Button  onClick={(() => handleSpeed(2))}>2x</Button>

问题是,我的播放器是另一个组件,需要将按钮上设置的速度发送到我的组件。这是我的做法:

  1. I've a button and, its button send the speed via onClick:

    <Button  onClick={(() => handleSpeed(2))}>2x</Button>
    
  2. After that, i've a method who send the speed to the component, of the player:

function handleSpeed(e) {
    if (onSpeed) onSpeed(e);
    // console.log('onspeed set dentro da timeline velocidade igual a: ', e)
    return e
  }
  1. onspeed是我的时间轴组件的一个属性,它将设置的速度发送到我的父组件,并且该速度的接收方式如下:
function setSpeed(e) {
    const recordSpeed = get(recordRef, "current.setSpeed", e)
    recordSpeed()
  }
  1. 问题是,我的播放器组件使用forwardRef通过ref进行了诸如播放,暂停,恢复,停止之类的动作,以下是play动作的一个示例:
play: () => {
          if (replayerRef.current) {
            if (pauseTimeOffset) {
              return replayerRef.current.resume(pauseTimeOffset);
            }
            replayerRef.current.play();          
          }
        },
  1. 我想通过按钮的属性传递到播放器组件的速度,但是,由于某种原因,我无法做到这一点,我正在这样做:
function setSpeed(e){
      replayerRef.current.config.speed = e;
    }
  1. 我的“ e”未定义。

你们知道吗,我可以通过Click获取速度并在播放器组件中接收该速度,而无需更改组件的结构吗?

评论