問題の1.参照機能は、アセンブリで使用することはできません
エラー:
エラー:関数のコンポーネントは、レフリーを持つことができません。あなたはReact.forwardRef()を使用することを意味していましたか?
実際には、それがどのReact.forwardRef()、その上に、コールバック関数を開けません。
let input = null;
function clickHandler () {
if (input !== null) {
if (input.value !== "") {
dispatch(addTodo(input.value));
}
}
}
return (
<div>
<input type="text" ref={node => {input = node}/>
<button onClick={clickHandler}>ADD</button>
</div>
)
2.サイクルトリガSETSTATE()
これはReduxのを学んで発生したエラーです。
エラー:
不明なエラー:最大更新深超えました。コンポーネントが繰り返しcomponentWillUpdateまたはcomponentDidUpdate内SETSTATEを呼び出したときに発生することがあります。ネストされた更新の数が無限ループを防ぐために制限を反応させます。
実際には、コンポーネントがレンダリングされるとき、それによってSETSTATEをトリガー、実行状態を変えることができるので、行っていることを、あなたはあなたをバインドするためにバインドされている場合に機能が、実行機能ではありませんし、その後変更トリガー。
<Todo
key = {`${index}`}
text = { todo.text }
finished = { todo.finished }
onClick = {onTodoClick(todo.id)}
/>
それは次のように記述する必要があります
onClick = {() => onTodoClick(todo.id)}
3.カスタムコンポーネントに反応するイベントをバインドすることはできません
エラーが学校であるが反応し、Reduxのが見つかりました。私はVueのを覚えている書き込みのVueの年の最後の時間は前半分であるが、のようです、私は忘れて、可能であるように思われます。
カスタムラベルを持っているよう藤堂部品など、その内部には、特定の物事はあなたが、あなたが層を書き留めする必要があります、onClickイベントは、藤堂コンポーネントをトリガされませんやって転送するために使用する小道具を必要とし、Pでありますそれによってトリガpタグ、。
<Todo
onClick = {() => { onTodoClick(todo.id) }}
/>
这样是不会触发的,必须由真实的dom标签触发,因此要追加如下内容:
const Todo = ({onClick}) => {
return (
<li onClick={onClick}>
<p style={{fontSize: '32px'}}>{text}</p>
</li>
)
}