I want to use document.execCommand ("copy") to click the button to copy the link, but display
TypeError: Cannot read property "select" of undefinedCode:
import React, { Component } from "react"
import MuiThemeProvider from "material-ui/styles/MuiThemeProvider"
import {Card, CardActions, CardHeader, CardMedia, CardTitle, CardText} from "material-ui/Card"
import RaisedButton from "material-ui/RaisedButton"
import RemoveRedEye from "material-ui/svg-icons/image/remove-red-eye"
import ActionGrade from "material-ui/svg-icons/action/grade"
class card extends Component {
state = {
width: window.screen.availWidth > 1280 ? "20%" : "100%"
}
//
copysvn = () => {
this.refs.ref.select()
document.execCommand("copy")
console.log(1111)
}
render() {
const ref = "svn" + this.props.index
const string = "" + this.props.like
return (
<MuiThemeProvider>
<Card style={{width: this.state.width, margin: "10px 2.5%", float: "left"}}>
<CardHeader
title={this.props.headtitle}
subtitle={this.props.headsubtitle}
avatar={this.props.avatar}
/>
<CardMedia
>
<img src={this.props.imgsrc} alt="" />
</CardMedia>
<CardTitle title={this.props.cardtitle} subtitle={this.props.subtitle} />
<CardText style={{height: "100px", overflow: "hidden"}}>
{this.props.cardtext}
</CardText>
<CardActions>
<input type="text" ref={ref} value={this.props.svn} style={{display: "none"}}/>
<RaisedButton label="svn" primary={true} onClick={this.copysvn} icon={<RemoveRedEye />}/>
<RaisedButton label={string} primary={true} icon={<ActionGrade />}/>
</CardActions>
</Card>
</MuiThemeProvider>
)
}
}
export default card