Add copy to clipboard to Header
This commit is contained in:
parent
2907980d36
commit
879458506e
1 changed files with 24 additions and 4 deletions
|
|
@ -1,17 +1,37 @@
|
|||
import React from 'react'
|
||||
import './Nav.css'
|
||||
import React, { useRef, useState } from 'react'
|
||||
import { Link } from 'react-router-dom'
|
||||
|
||||
import './Header.css'
|
||||
|
||||
import Button from '../Button/Button'
|
||||
|
||||
class Header extends React.Component {
|
||||
constructor(props) {
|
||||
super(props)
|
||||
this.copyToClipboard = this.copyToClipboard.bind(this)
|
||||
}
|
||||
|
||||
copyToClipboard() {
|
||||
const el = document.createElement('input')
|
||||
el.value = window.location.href
|
||||
el.id = 'url-input'
|
||||
document.body.appendChild(el)
|
||||
|
||||
el.select()
|
||||
document.execCommand('copy')
|
||||
el.remove()
|
||||
}
|
||||
|
||||
render() {
|
||||
return <nav className="Header">
|
||||
<div className="left">
|
||||
<Link to='/'>
|
||||
<Button type="new">New</Button>
|
||||
</Link>
|
||||
</div>
|
||||
<div className="push" />
|
||||
<div className="right">
|
||||
<Button type="link">Copy link</Button>
|
||||
<Button type="link" click={this.copyToClipboard}>Copy link</Button>
|
||||
<Button type="menu">Menu</Button>
|
||||
</div>
|
||||
</nav>
|
||||
|
|
|
|||
Loading…
Reference in a new issue