在reactjs中显示输入值时出现错误，无法读取属性

我收到以下错误：类型错误：无法读取未定义的属性“setState”
当我尝试使用@react pdf/renderer包在pdf中显示输入值时
错误正好在：{this.setState.title}行
有人能告诉我是什么原因导致我的情况下，这个错误，提前谢谢你。 这是我的代码：

import React, { Component } from 'react';
import { PDFDownloadLink, Document, Page, Text, View, StyleSheet } from '@react-pdf/renderer';

const styles = StyleSheet.create({
  page: {
    flexDirection: 'row',
    backgroundColor: '#E4E4E4'
  },
  section: {
    margin: 10,
    padding: 10,
    flexGrow: 1
  }
});

// Create Document Component
const MyDocument = () => (
  <Document>
    <Page size="A4" style={styles.page}>
      <View style={styles.section}>
        <Text>{this.setState.title}</Text>
      </View>
      <View style={styles.section}>
        <Text>Section #2</Text>
      </View>
    </Page>
    
  </Document>
);

class Form extends Component {
  state = { 
    title: '',
    
    url: null };

    onChange = input => e => {
        this.setState({
            [input]: e.target.value
        });
    }

  onRender = ({ blob }) => {
    this.setState({ url: URL.createObjectURL(blob) });
  };

  render() {
    return (
        <div>
            <input onChange={this.onChange('title')} name="title" type="text" placeholder="Post Title" className="form-control" />
            Download your PDF here:
            <PDFDownloadLink
                document={<MyDocument/>}
                fileName="doc.pdf">
                    {({ blob, url, loading, error }) => (
                        loading ? 'Loading...' : 'Download!'
                    )}
            </PDFDownloadLink>
        </div>
    );
  }
}

export default Form;

import React，{Component}来自'React'；
从“@react pdf/renderer”导入{PDFDownloadLink，文档，页面，文本，视图，样式表}；
const styles=StyleSheet.create({
第页：{
flexDirection:'行'，
背景颜色：“#e4”
},
第节：{
差额：10，
填充：10，
flexGrow:1
}
});
//创建文档组件
常量MyDocument=（）=>(
{this.setState.title}
第2节
);
类形式扩展组件{
状态={
标题：“”，
url:null}；
onChange=input=>e=>{
这是我的国家({
[输入]：e.target.value
});
}
onRender=（{blob}）=>{
this.setState（{url:url.createObjectURL（blob）}）；
};
render（）{
返回(
请在此处下载您的PDF：
{（{blob，url，加载，错误}）=>(
正在加载？“正在加载…”：“下载！”
)}
);
}
}
导出默认表单；

问题在于此时在功能组件中使用它

const MyDocument = () => (
  <Document>
    <Page size="A4" style={styles.page}>
      <View style={styles.section}>
        <Text>{this.setState.title}</Text>    /// this point
      </View>
      <View style={styles.section}>
        <Text>Section #2</Text>
      </View>
    </Page>
    
  </Document>
);

constmydocument=（）=>(
{this.setState.title}///此点
第2节
);

您应该将此值作为道具传递给此组件

const MyDocument = (props) => (
  <Document>
    <Page size="A4" style={styles.page}>
      <View style={styles.section}>
        <Text>{props.title}</Text>    /// this point
      </View>
      <View style={styles.section}>
        <Text>Section #2</Text>
      </View>
    </Page>
    
  </Document>
);

constmydocument=（道具）=>(
{props.title}///这一点
第2节
);

并将头衔作为道具传递

<PDFDownloadLink
                document={<MyDocument title={this.state.title}/>}
                fileName="doc.pdf">
                    {({ blob, url, loading, error }) => (
                        loading ? 'Loading...' : 'Download!'
                    )}
            </PDFDownloadLink>

{（{blob，url，加载，错误}）=>(
正在加载？“正在加载…”：“下载！”
)}

谢谢。如果您能帮忙，请看一下这个问题