Что такое useState () в React?
<script type='text/javascript'>
var lookup = '\n\n\n\n\n\n2 PC Games \n\n\n\n';
lookup = lookup.trim() ;
alert(lookup );
var tttt = 'tttt';
alert((/\b(lookup)\b/g).test(2));
</script>
Трудно сказать, что вы пытаетесь сделать здесь. Какова должна быть переменная tttt?
В какую строку вы пытаетесь выполнить поиск? Вы пытаетесь найти 2 в строке lookup? Тогда вам нужно:
/\b2\b/.test(lookup)
Следующее из вашего регулярного выражения создает регулярное выражение, состоящее из границы слова, за которым следует строка "lookup" (а не значение, содержащееся в переменной lookup), за которым следует граница слова. Затем он пытается сопоставить это регулярное выражение со строкой "2", полученной путем преобразования числа 2 в строку:
(/\b(lookup)\b/g).test(2)
Например, следующие возвраты true:
(/\b(lookup)\b/g).test("something to lookup somewhere")
1 ответ
useState() Реагировать рычаг. Рычаги делают возможными использовать состояние и переменчивость в функциональных компонентах.
, В то время как Вы не можете использовать рычаги в классах, можно перенести компонент класса с функциональным и использовать рычаги от него. Это - большой инструмент для миграции компонентов от класса для функционирования формы. Вот полный пример:
Для этого примера я буду использовать встречный компонент. Это - это:
class Hello extends React.Component {
constructor(props) {
super(props);
this.state = { count: props.count };
}
inc() {
this.setState(prev => ({count: prev.count+1}));
}
render() {
return <button onClick={() => this.inc()}>{this.state.count}</button>
}
}
ReactDOM.render(<Hello count={0}/>, document.getElementById('root'))<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id='root'></div>Это - простой компонент класса с состоянием количества, и обновление состояния сделано методами. Это - очень общий шаблон в компонентах класса. Первая вещь состоит в том, чтобы перенести его с функциональным компонентом только с тем же именем, тот делегат все его свойства к перенесенному компоненту. Также необходимо представить перенесенный компонент в функциональном возврате.Вот:
function Hello(props) {
class Hello extends React.Component {
constructor(props) {
super(props);
this.state = { count: props.count };
}
inc() {
this.setState(prev => ({count: prev.count+1}));
}
render() {
return <button onClick={() => this.inc()}>{this.state.count}</button>
}
}
return <Hello {...props}/>
}
ReactDOM.render(<Hello count={0}/>, document.getElementById('root'))<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id='root'></div>Это - точно тот же компонент, с тем же поведением, тем же именем и теми же свойствами. Теперь позволяет, снимают состояние подсчета к функциональному компоненту. Это - то, как это идет:
function Hello(props) {
const [count, setCount] = React.useState(0);
class Hello extends React.Component {
constructor(props) {
super(props);
this.state = { count: props.count };
}
inc() {
this.setState(prev => ({count: prev.count+1}));
}
render() {
return <button onClick={() => setCount(count+1)}>{count}</button>
}
}
return <Hello {...props}/>
}
ReactDOM.render(<Hello count={0}/>, document.getElementById('root'))<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.8.6/umd/react.production.min.js" integrity="sha256-3vo65ZXn5pfsCfGM5H55X+SmwJHBlyNHPwRmWAPgJnM=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.8.6/umd/react-dom.production.min.js" integrity="sha256-qVsF1ftL3vUq8RFOLwPnKimXOLo72xguDliIxeffHRc=" crossorigin="anonymous"></script>
<div id='root'></div> Примечание, что метод inc все еще там, это привычка, причинило кому-либо боль, на самом деле мертвый код. Это - идея, просто продолжите подъем состояния. После того как Вы закончили, можно удалить компонент класса:
function Hello(props) {
const [count, setCount] = React.useState(0);
return <button onClick={() => setCount(count+1)}>{count}</button>;
}
ReactDOM.render(<Hello count={0}/>, document.getElementById('root'))<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.8.6/umd/react.production.min.js" integrity="sha256-3vo65ZXn5pfsCfGM5H55X+SmwJHBlyNHPwRmWAPgJnM=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.8.6/umd/react-dom.production.min.js" integrity="sha256-qVsF1ftL3vUq8RFOLwPnKimXOLo72xguDliIxeffHRc=" crossorigin="anonymous"></script>
<div id='root'></div>, В то время как это делает возможным использовать рычаги в компонентах класса, я не рекомендовал бы Вам сделать так кроме того, если бы Вы мигрирующий как я сделал в этом примере. Смешивание функции и компонентов класса сделает управление состоянием путаницей. Я надеюсь, что это помогает
Наилучшие пожелания