あなたの干支バッジを作る(英雄伝奇五指警報器)ログ-5

💫 styled-conentsはトピックのパレットとフォントを提供します

 まず、グローバルなテーマパレットとフォントDefaultThemeを提供します.デザインに才能がなさそうだ.たいしたことではありませんが、TypeScriptに関する面白い間違いがあったので書きました.
 ベロフ特大人の反応講座を見ると、以下のコードがあります.

const colorStyles = css`
  ${({ theme, color }) => {
    const selected = theme.palette[color];
    return css`
      background: ${selected};
      &:hover {
        background: ${lighten(0.1, selected)};
      }
      &:active {
        background: ${darken(0.1, selected)};
      }
    `;
  }}
`;

 タイプスクリプトに適用する場合はtheme.パレット部分でエラーが発生しました.タイプスクリプトではstring literal typeのみがオブジェクトをインデックス化できますが、string literal typeはstringよりも狭義なタイプで、システムは変わらないread only stringのみを与えます.上のコードのcolorは随時変化するパラメータであるため、default themeにインデックス署名属性を与えることができます.
style.d.ts

import 'styled-components'

declare module 'styled-components'{
    export interface DefaultTheme {
        palette:{
            [index:string]:string;
        }
    }
}

💭 Readyコンポーネントの実装

  Readyコンポーネントは、デフォルトではクライアントの実行時に自動的に削除されますが、クライアントの実行時にはユーザーの詳細を確認し、Dage Alamアルゴリズムをいつでも開き、ユーザーがカスタマイズできる機能を実行します.初めてElectronでCustom Title Barを作る方法を知り、簡単でした.
Mainプロセスでは、BrowserWindowオブジェクトのタイトルバースタイルプロパティをhiddenに設定し、Reaction Webビューでタイトルバー領域を指定し、cssで「-webkit-app-region:drag;」を指定します.属性を付与します.その後、アイコン(ウィンドウを閉じるなど)ボタンを実行すると、イベントはIPC通信でメインプロセスに接続されます.

😇 3つのstoreを持つReduxの設定

  ゲームに関連するアクティビティの多くは、電子メールプロセスで発生します.クライアントAPIおよびaxiosは、いずれもCORSエラーのためにプライマリ・プロセス上で実行されるため、IPC通信によってレンダラー・プロセスおよび応答に1つずつ渡さなければならない.これまでipcメッセージを作成し、受信したメッセージをreact hookとして処理してきましたが、私が想定していた最強の多機能アプリケーションを実現するには、2つのウィンドウと1つのメインプロセスの状態管理が必要なので、メッセージに基づいて1つの状態管理を行うのは非常に不便です.
 このとき、私は李徳思を思い出しました.彼は主にグローバル状態管理に使用されるライブラリにしか概念を持っていません.動作によるステータス変更の場合、同じストレージ領域でipc通信で動作を励起するだけで、メインプロセスでデータパッチを行い、レンダラープロセスで自動的にデータパッチを実行できます.
 驚いたことに、Elecrton-Reduxライブラリは私の考えを実現したようです.しかし、実際にはプロジェクトには適用されていないが、コンテキストブリッジというIPC通信の前処理を考慮していないため、エラーが発生した.私が直接実現した速度はもっと速く、想像以上に処理が速いので、3つの店で同じ動作を一度にDispatchできるミドルウェアを設計しました.
 従来のプロジェクトでは,グローバル状態管理をContextAPIとして行っていたが,当時のContextAPIの良好な直感性とLee Dux特有の複雑さが結合しており,Lee Duxを使用する必要はなく,見たくもないように見えたが,問題解決のために導入したところかなりの利点があることが分かった.
以下に、本プロジェクトでRidexを使用した場合のメリットを示します.

反応器に属するライブラリからではないため、電子計算機と反応器で同時に店を作成することができます.

ミドルウェアを記述できるため、リアクター(レンダラープロセス)で電子計算機(メインプロセス)からの動作を自動的に励起することもできます.

ボリュームクライアントからの情報は、ミドルウェアを使用して自動的にグローバル検索に関連付けることができます.

 李徳思の走り曲線は本当に負担だ.データのパッチ処理は複雑すぎます.このような私がreduceをある程度熟知したきっかけは,dispatch関数に直接動作オブジェクトを入れることである.

store.dispatch({type:'-', payload:'-'})

 ベロフトの講座も同様で、Dispatchには動作生成関数があり、オブジェクトを返す関数にすぎないが、実際には思ったほど重要ではない.学習の観点から見ると、その「詐欺」はかなりの障害であり、自分でコンソールを撮影し、複雑さを減らそうとするのが最も速い学習方法である.

ステータス定義が完了しました.画像ウィンドウで動作するたびに、データがDispatchされていることをreduceで確認し、正式にデータの可視化に入るだけで済みます.
ああ、難しいですね.