我使用React扫描了qrcode.它显示了结果.我的代码没问题.但是我想把结果保存在一个变量中.我如何使用react做

Question

我已经使用React扫描了qrcode。它显示了结果。我的代码没问题。但是我想把结果保存在一个变量中。我如何使用react做到这一点?下面是我的代码。我想保存结果(扫描后收到的qrcode)在一个变量。

import React, { Component } from 'react'
import QrReader from 'react-qr-scanner'
 
class App extends Component {
  
  constructor(props){
    
    super(props)
    this.state = {
      delay: 100,
      result: 'No result',
    }
 
    this.handleScan = this.handleScan.bind(this)
  }
  handleScan(data){
    let value= this.setState({
      result: data,
    })
    console.log(value);
  }
  handleError(err){
    console.error(err)
  }
  render(){
    const previewStyle = {
      height: 240,
      width: 320,
    }
 
    return(
      <div>
        <QrReader
          delay={this.state.delay}
          style={previewStyle}
          onError={this.handleError}
          onScan={this.handleScan}
          />
        <p>{this.state.result}</p>`enter code here`
        
      </div>
    )
  }
}
export default App;

Answer 1

您已经有了一个变量。这个.state.result在你成功扫描后保存你的数据。如果你出于某种原因想要复制它你可以说

let value = [...this.state.result]

我不确定这个值到底是什么样子的，或者你需要它做什么，但这是一种将值保存到新变量中的方法。

Answer 2

你的句柄应该是

handleScan(data){
    this.setState({
      result: data,
    })
    console.log(data);
  }

Answer 3

handleScan(data)函数必须是这样的:

handleScan(data){
    let value = data
    this.setState({ result: data })
    console.log(value)
}

让我看看这是怎么回事。

1. 将变量data的值保存到变量value
2. 将变量data的值保存到状态对象
3. 打印保存在变量value中的值

或者直接使用状态来保存和打印值。

handleScan(data){
    this.setState({ result: data })
    console.log(this.state.result)
}