forked from CringeStudios/gamja
components: Use onInput instead of onChange
This is one of the differences between React and Preact: https://preactjs.com/guide/v10/differences-to-react/#use-oninput-instead-of-onchange Closes: https://todo.sr.ht/~emersion/gamja/128
This commit is contained in:
parent
081f5743be
commit
c547a32282
@ -9,7 +9,7 @@ export default class NetworkForm extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.handleChange = this.handleChange.bind(this);
|
||||
this.handleInput = this.handleInput.bind(this);
|
||||
this.handleSubmit = this.handleSubmit.bind(this);
|
||||
|
||||
if (props.username) {
|
||||
@ -17,7 +17,7 @@ export default class NetworkForm extends Component {
|
||||
}
|
||||
}
|
||||
|
||||
handleChange(event) {
|
||||
handleInput(event) {
|
||||
let target = event.target;
|
||||
let value = target.type == "checkbox" ? target.checked : target.value;
|
||||
this.setState({ [target.name]: value });
|
||||
@ -31,7 +31,7 @@ export default class NetworkForm extends Component {
|
||||
|
||||
render() {
|
||||
return html`
|
||||
<form onChange=${this.handleChange} onSubmit=${this.handleSubmit}>
|
||||
<form onInput=${this.handleInput} onSubmit=${this.handleSubmit}>
|
||||
<label>
|
||||
Username:<br/>
|
||||
<input type="username" name="username" value=${this.state.username} required/>
|
||||
|
@ -17,7 +17,7 @@ export default class ConnectForm extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.handleChange = this.handleChange.bind(this);
|
||||
this.handleInput = this.handleInput.bind(this);
|
||||
this.handleSubmit = this.handleSubmit.bind(this);
|
||||
|
||||
if (props.params) {
|
||||
@ -32,7 +32,7 @@ export default class ConnectForm extends Component {
|
||||
}
|
||||
}
|
||||
|
||||
handleChange(event) {
|
||||
handleInput(event) {
|
||||
let target = event.target;
|
||||
let value = target.type == "checkbox" ? target.checked : target.value;
|
||||
this.setState({ [target.name]: value });
|
||||
@ -147,7 +147,7 @@ export default class ConnectForm extends Component {
|
||||
}
|
||||
|
||||
return html`
|
||||
<form onChange=${this.handleChange} onSubmit=${this.handleSubmit}>
|
||||
<form onInput=${this.handleInput} onSubmit=${this.handleSubmit}>
|
||||
<h2>Connect to IRC</h2>
|
||||
|
||||
<label>
|
||||
|
@ -8,7 +8,7 @@ export default class JoinForm extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.handleChange = this.handleChange.bind(this);
|
||||
this.handleInput = this.handleInput.bind(this);
|
||||
this.handleSubmit = this.handleSubmit.bind(this);
|
||||
|
||||
if (props.channel) {
|
||||
@ -16,7 +16,7 @@ export default class JoinForm extends Component {
|
||||
}
|
||||
}
|
||||
|
||||
handleChange(event) {
|
||||
handleInput(event) {
|
||||
let target = event.target;
|
||||
let value = target.type == "checkbox" ? target.checked : target.value;
|
||||
this.setState({ [target.name]: value });
|
||||
@ -34,7 +34,7 @@ export default class JoinForm extends Component {
|
||||
|
||||
render() {
|
||||
return html`
|
||||
<form onChange=${this.handleChange} onSubmit=${this.handleSubmit}>
|
||||
<form onInput=${this.handleInput} onSubmit=${this.handleSubmit}>
|
||||
<label>
|
||||
Channel:<br/>
|
||||
<input type="text" name="channel" value=${this.state.channel} autofocus required/>
|
||||
|
@ -22,7 +22,7 @@ export default class NetworkForm extends Component {
|
||||
|
||||
this.prevParams = { ...defaultParams };
|
||||
|
||||
this.handleChange = this.handleChange.bind(this);
|
||||
this.handleInput = this.handleInput.bind(this);
|
||||
this.handleSubmit = this.handleSubmit.bind(this);
|
||||
|
||||
if (props.params) {
|
||||
@ -35,7 +35,7 @@ export default class NetworkForm extends Component {
|
||||
}
|
||||
}
|
||||
|
||||
handleChange(event) {
|
||||
handleInput(event) {
|
||||
let target = event.target;
|
||||
let value = target.type == "checkbox" ? target.checked : target.value;
|
||||
this.setState({ [target.name]: value });
|
||||
@ -85,7 +85,7 @@ export default class NetworkForm extends Component {
|
||||
}
|
||||
|
||||
return html`
|
||||
<form onChange=${this.handleChange} onSubmit=${this.handleSubmit}>
|
||||
<form onInput=${this.handleInput} onSubmit=${this.handleSubmit}>
|
||||
<label>
|
||||
Hostname:<br/>
|
||||
<input type="text" name="host" value=${this.state.host} autofocus required/>
|
||||
|
@ -9,11 +9,11 @@ export default class RegisterForm extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.handleChange = this.handleChange.bind(this);
|
||||
this.handleInput = this.handleInput.bind(this);
|
||||
this.handleSubmit = this.handleSubmit.bind(this);
|
||||
}
|
||||
|
||||
handleChange(event) {
|
||||
handleInput(event) {
|
||||
let target = event.target;
|
||||
let value = target.type == "checkbox" ? target.checked : target.value;
|
||||
this.setState({ [target.name]: value });
|
||||
@ -27,7 +27,7 @@ export default class RegisterForm extends Component {
|
||||
|
||||
render() {
|
||||
return html`
|
||||
<form onChange=${this.handleChange} onSubmit=${this.handleSubmit}>
|
||||
<form onInput=${this.handleInput} onSubmit=${this.handleSubmit}>
|
||||
<label>
|
||||
E-mail:<br/>
|
||||
<input
|
||||
|
@ -9,11 +9,11 @@ export default class SettingsForm extends Component {
|
||||
this.state.secondsInTimestamps = props.settings.secondsInTimestamps;
|
||||
this.state.bufferEvents = props.settings.bufferEvents;
|
||||
|
||||
this.handleChange = this.handleChange.bind(this);
|
||||
this.handleInput = this.handleInput.bind(this);
|
||||
this.handleSubmit = this.handleSubmit.bind(this);
|
||||
}
|
||||
|
||||
handleChange(event) {
|
||||
handleInput(event) {
|
||||
let target = event.target;
|
||||
let value = target.type == "checkbox" ? target.checked : target.value;
|
||||
this.setState({ [target.name]: value }, () => {
|
||||
@ -56,7 +56,7 @@ export default class SettingsForm extends Component {
|
||||
}
|
||||
|
||||
return html`
|
||||
<form onChange=${this.handleChange} onSubmit=${this.handleSubmit}>
|
||||
<form onInput=${this.handleInput} onSubmit=${this.handleSubmit}>
|
||||
<label>
|
||||
<input
|
||||
type="checkbox"
|
||||
|
@ -9,11 +9,11 @@ export default class RegisterForm extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.handleChange = this.handleChange.bind(this);
|
||||
this.handleInput = this.handleInput.bind(this);
|
||||
this.handleSubmit = this.handleSubmit.bind(this);
|
||||
}
|
||||
|
||||
handleChange(event) {
|
||||
handleInput(event) {
|
||||
let target = event.target;
|
||||
let value = target.type == "checkbox" ? target.checked : target.value;
|
||||
this.setState({ [target.name]: value });
|
||||
@ -27,7 +27,7 @@ export default class RegisterForm extends Component {
|
||||
|
||||
render() {
|
||||
return html`
|
||||
<form onChange=${this.handleChange} onSubmit=${this.handleSubmit}>
|
||||
<form onInput=${this.handleInput} onSubmit=${this.handleSubmit}>
|
||||
<p>Your account <strong>${this.props.account}</strong> has been created, but a verification code is required to complete the registration.</p>
|
||||
|
||||
<p>${linkify(this.props.message)}</p>
|
||||
|
Loading…
x
Reference in New Issue
Block a user