javascript - 如何获得字符数限制,包括默认名称-Reactjs
问题描述
我正在尝试获取输入框的字符限制,但输入字段具有默认值。
如果字符限制超过文本必须出现在 0 限制(不弹出)
如果我使用下面的代码,它不能满足我的要求(比如默认值已经存在)。
如果它为 0,我可以知道如何包含默认值并设置消息吗
class Company extends React.Component {
state = {
Title: this.props.selectedTable.Title,
chars_left: 50,
max_char:50
}
handleCharacterCount= (event) => {
const charCount = event.target.value.length;
const maxChar = this.state.max_char;
const charLength = maxChar - charCount;
this.setState({ chars_left: charLength });
//this.setState({sTitle: e.target.value});
}
render() {
return (
<div>
<textArea
type="text"
maxLength="50"
required
onChange={this.handleCharacterCount}
value={this.state.Title}/>
/>
<p>{this.state.chars_left}</p>
</div>
)
}
}
解决方案
你可以试试这个
state = {
Title: this.props.selectedTable.Title,
chars_left: 50 - this.props.selectedTable.Title.length,
max_char:50
}
handleCharacterCount= (event) => {
const charCount = event.target.value.length;
const maxChar = this.state.max_char;
const charLength = maxChar - charCount;
this.setState({ chars_left: charLength,Title: event.target.value })}
render() {
return (
<div>
<textArea
type="text"
maxLength="50"
required
onChange={this.handleCharacterCount}
value={this.state.Title}/>
/>
{
!this.state.chars_left &&
<p>text has to appear at 0 limit</p>
}
<p>{this.state.chars_left}</p>
</div>)}
推荐阅读
- android - 迭代 JSON 数组并使用 Name 值来识别一个 TextView Android
- java - java Haversine公式(数学)NullPointerException报错问题
- javascript - 如何读出 Javascript 中元素的位置?
- python - subprocess.check_output 显示忽略异常时的错误输出
- reactjs - Why calling useState function is working without declaring it?
- javascript - 允许用于 chrome 扩展清单匹配的 URI 方案
- java - 为什么我在这里得到 java.lang.ArrayIndexOutOfBoundsException?
- bash - SSH 从 Ubuntu 到 Windows 7
- discord - 有人可以解释对 bulkDelete 的更改(discord.js)
- node.js - 运行 npm dev 时出现节点错误 (webpack-cli)。无法弄清楚错误消息的含义