Question

我正在尝试访问通过组件传递的道具。该道具是语音记录，每当笔录道具在渲染成道具的主要组件中发生变化时，我都需要运行该函数。我在身体组件内部使用onChange，因为该组件包含一个跨度，每次有人讲话时，该跨度都会随着口述笔录更新。

我尝试将成绩单作为直接道具传递，但是它在我的主要组件中返回undefined


//the component that contains the transcript

import React, { Component } from "react";
import SpeechRecognition from "react-speech-recognition";
import { Button } from 'react-bootstrap';


class Dictaphone extends Component {

  render() {
   const {transcript, resetTranscript, browserSupportsSpeechRecognition} = this.props

    return (
      <div>
        <span className="transcriptspan">{transcript}</span>
        <Button transcript={transcript} variant="outline-dark" onClick={resetTranscript}>Reset</Button>
        </div>
    )
  }
}

export default SpeechRecognition(Dictaphone)



// inside the main component where I am trying to view the transcript passed in from the SpeechRecognition component

  <div className="bottombtns">
     <SpeechRecognition grabIntent={this.props.grabIntent} id="speakAloud" className="audioBtns" onChange={()=>{ console.log(this.props.transcript)}}/>           
  </div>


I'd like to be able to console log the transcript coming from SpeechRecognition so that I can update things in my main component when the transcript changes.

从另一个组件内的导出组件访问prop

0 个答案: