Я пытаюсь проверить, является ли первая буква строки прописной.
charAt() у меня не работает, если у вас есть другое решение для проверки того, является ли первая буква прописной, я буду благодарен.
Пробовал так проверять - this.state.firstName[0] === this.state.firstName[0].toUpperCase() но у меня тоже не работает
class Profile extends Component {
state = {
details: {
firstName: '',
lastName: '',
ID: '',
Email: ''
}
};
OnSubmit = e => {
e.preventDefault();
if (
this.state.firstName.charAt(0) ===
this.state.firstName.charAt(0).toUpperCase()
) {
console.info('error');
}
};
OnChange = e => {
e.preventDefault();
this.setState({
details: { ...this.state.details, [e.target.name]: e.target.value }
});
};
render() {
return (
<div>
<div className = "container text-center mt-4" style = {{ width: '500px' }}>
<form className = "px-4 py-3" onSubmit = {this.OnSubmit}>
<div className = "form-group">
<label>First Name:</label>
<input
type = "text"
className = "form-control"
onChange = {this.OnChange}
name = "firstName"
/>
</div>
<div className = "form-group">
<label>Last Name:</label>
<input
type = "text"
className = "form-control"
onChange = {this.OnChange}
name = "lastName"
/>
</div>
<div className = "form-group">
<label>ID Number:</label>
<input
type = "text"
className = "form-control"
onChange = {this.OnChange}
name = "ID"
/>
</div>
<div className = "form-group">
<label>Email:</label>
<input
type = "text"
className = "form-control"
onChange = {this.OnChange}
name = "Email"
/>
</div>
<button type = "submit" className = "btn btn-secondary mt-3">
Check
</button>
</form>
</div>
</div>
);
}
}
export default Profile;
charAt () дает мне ошибку - «Uncaught TypeError: невозможно прочитать свойство« charAt »неопределенного»
Вы не пропустили details в своем this.state.firstName звонке? как this.state.details.firstName.charAt(0) ?
Да, я пропустил детали.........





Простой способ проверить, является ли первая буква в строке прописной. Проверьте демо ниже
import React, { Component } from 'react';
import { render } from 'react-dom';
import Hello from './Hello';
import './style.css';
class App extends Component {
constructor() {
super();
this.state = {
name: 'React'
};
}
componentWillMount()
{
if (this.state.name[0] >= 'A' && this.state.name[0] <= 'Z')
this.setState({ name: "First letter is uppercase" })
else
this.setState({ name: "First letter is NOT uppercase" })
}
render() {
return (
<div>
<p>
{this.state.name}
</p>
</div>
);
}
}
render(<App />, document.getElementById('root'));
Этот ответ учитывает только самый стандартный латинский алфавит, и буду не работает.
В состоянии у вас есть объект сведений, вы можете получить доступ к имени и фамилии через объект сведений.
class Profile extends Component {
state = {
details: {
firstName: '',
lastName: '',
ID: '',
Email: ''
}
};
OnSubmit = e => {
e.preventDefault();
if (
this.state.details.firstName.charAt(0) ===
this.state.details.firstName.charAt(0).toUpperCase()
) {
console.info('error');
}
};
OnChange = e => {
e.preventDefault();
this.setState({
details: { ...this.state.details, [e.target.name]: e.target.value }
});
};
render() {
return (
<div>
<div className = "container text-center mt-4" style = {{ width: '500px' }}>
<form className = "px-4 py-3" onSubmit = {this.OnSubmit}>
<div className = "form-group">
<label>First Name:</label>
<input
type = "text"
className = "form-control"
onChange = {this.OnChange}
name = "firstName"
/>
</div>
<div className = "form-group">
<label>Last Name:</label>
<input
type = "text"
className = "form-control"
onChange = {this.OnChange}
name = "lastName"
/>
</div>
<div className = "form-group">
<label>ID Number:</label>
<input
type = "text"
className = "form-control"
onChange = {this.OnChange}
name = "ID"
/>
</div>
<div className = "form-group">
<label>Email:</label>
<input
type = "text"
className = "form-control"
onChange = {this.OnChange}
name = "Email"
/>
</div>
<button type = "submit" className = "btn btn-secondary mt-3">
Check
</button>
</form>
</div>
</div>
);
}
}
export default Profile;
Похоже, что есть объект сведений, который содержит firstName и другие свойства;
this.state.details.firstName.charAt(0) === this.state.details.firstName.charAt(0).toUpperCase()работает?