Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- import * as React from "react"
- import { PropertyControls, ControlType } from "framer"
- const style: React.CSSProperties = {
- height: "100%",
- display: "flex",
- alignItems: "center",
- justifyContent: "center",
- textAlign: "center",
- color: "#FFF",
- overflow: "hidden",
- }
- interface Props {
- value: string
- }
- interface States {
- inputValue: string
- }
- export class Input extends React.Component<Props> {
- static defaultProps = {
- value: "",
- }
- static propertyControls: PropertyControls = {
- value: { type: ControlType.String, title: "Text" },
- }
- state = {
- value: this.props.value,
- }
- handleInputValue(e) {
- this.setState({
- value: e.target.value,
- })
- }
- componentWillReceiveProps(props: Props) {
- if (props.value !== this.props.value) {
- this.setState({ value: props.value })
- }
- }
- render() {
- return (
- <div>
- <input
- value={this.state.value}
- onChange={e => this.handleInputValue(e)}
- />
- <h1>{this.state.value}</h1>
- </div>
- )
- }
- }
- export default Input
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement