我如何在 React Native 中使用按钮截取屏幕截图？

Question

我想开发一个简单的应用程序，可以通过按钮截取当前屏幕的屏幕截图。此代码运行成功但是当我按下捕获按钮时它不起作用并且 return 错误。

export default class App extends Component<{}> {
  render() {
    captureScreen({
      format: "jpg",
      quality: 0.8
    })
    .then(
      uri => console.log("Image saved to", uri),
      error => console.error("Oops, snapshot failed", error)
    );
    
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          Welcome to React Native SnapShot!
        </Text>
        <Text style={styles.instructions}>
          To get started, edit App.js
        </Text>
        <Text style={styles.instructions}>
          {instructions}
        </Text>
        <Button
          onPress={captureScreen.bind(this)}
          title="capture"
          color="#841584"
          accessibilityLabel="Capture"
        />
      </View>
    );
  }
}

Answer 1

为什么要在渲染中捕获屏幕截图？我认为您需要将屏幕截图片段移至单独的函数。

export default class App extends Component<{}> {
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          Welcome to React Native SnapShot!
        </Text>
        <Text style={styles.instructions}>
          To get started, edit App.js
        </Text>
        <Text style={styles.instructions}>
          {instructions}
        </Text>
        <Button
          onPress={() => {
            captureScreen({
              format: "jpg",
              quality: 0.8
            })
            .then(
              uri => console.log("Image saved to", uri),
              error => console.error("Oops, snapshot failed", error)
            );
          }}
          title="capture"
          color="#841584"
          accessibilityLabel="Capture"
        />
      </View>
    );
  }
}

我如何在 React Native 中使用按钮截取屏幕截图？

how can i take screenshot with a button in react native?

screenshot

reactjs

react-native