どのようにサイズを変更し、反応を還元することでキャンバスにレンダリングすることができます

Question

私はreact-reduxアプリケーションを書いています。キャンバスのサイズを変更したらどのようにレンダリングするのか分かりません。

基本的に2つのスライダがあり、変更すると、キャンバスの幅と高さが更新されます。私の減速家では、私はこの州の更新中にキャンバスにレンダリングすることができます。ただし、キャンバスが新しいディメンションを受け取ると、キャンバスはクリアされます。

それで、Reactが新しくサイズ変更されたキャンバスをレンダリングしたら、状態を更新する必要があります。レンダリングする必要があります（キャンバスディメンションを保持している同じレデューサーで行うことが望ましい）。

現在、私はこのようなReduxの-サンクでこれをやろうとしている：

 
export const setWidthAndRender = (width) => (dispatch) => { 
    dispatch(setWidth(width)); 

    setTimeout(dispatch(renderToCanvas), 10); 
}; 

これは、しかし、動作しません。私はそれがReactによってレンダリングされたと確信したら、どうやらrenderToCanvasをディスパッチしたいと思います。

アイデア？

Answer 1

キャンバスに新しいプロパティを追加する必要があります。たとえば、キャンバスを再レンダリングする必要がある場合はtrue、必要がない場合はfalseです。

関数のsetWidthはnewWidthをtrueに変更し、コンポーネントが次にcomponentDidUpdateを呼び出すときに幅が変更されたことを認識します。

componentDidUpdate（）動作するはずです。この

componentDidUpdate(){ 
     let {newWidth} = this.props.canvasProps 
     let {renderToCanvas} = this.props.actions; 

     if(newWidth === true){ 
      renderToCanvas(); // Set newWidth to false inside renderToCanvas() 
     } 
    } 

この方法のようになります。P