2021.03.30毎日レビュー


Facts

  • 地下鉄路線図の路線修正、削除機能を実現し、路線はすべて完成した.(7時間)
  • ページパッケージには、リフレッシュ時に404エラーが発生しないようにhistoryApiFallback:trueオプションが用意されています.
  • Feelings & Findings


    地下鉄路線図の路線修正、削除機能を実現し、路線はすべて完成した。


    今日の予測も間違っていた.最小区間追加機能は可能かと思いましたが、路線変更に時間がかかりすぎました.加えて7時から9時までサーバーが切れ、強制的に2時間休憩した.

    ネーミングの問題


    長い時間をかけてコースの色を変更した場合、既存の色を使用しようとすると重複した色が現れるため、検証結果を修正した結果、色が透明になるというエラーが発生しました.結果はどうやって解決したのか、あまり満足していない.不満な理由は変数名があいまいすぎることです.プレイヤーが選択した色はselectedLineColorで、修正ボタンをクリックすると、ルートの色はlineColorInEditです.私も少し混同していると思いますが、コメントするときは本当に理解しにくいです.でも適当な名前が思い出せない・・・

    querySelector(dataset)


    また、時間がかかったのは理由があります.datasetの名前のルートで、querySelectorでは見つかりません.駅の管理機能でよく探していましたが、なぜか路線的に無理でした.このレスリングで1時間を超えてやっと分かったのですが、正確な理由が分かりません.
    なぜならdocument.querySelector('[data-line-name=${line.name}]')が見つからないため、${line.name}部分をstring処理する必要があるからです.
    このようにdocument.querySelector('[data-line-name="${line.name}"]')を探すべきです.
    逆管理ボタンを使用しても問題がないのは、逆名に数字を登録できないためです.データセットを検索するとき、韓国語と英語だけを使用すると、stringを使用しなくても自動的にstringに入ります.
    しかし路線名の中の数字は1番線と同じで、1という数字があって、なぜstringを使わないのかさっぱり分からないのですが、""を割り当てて強制的にstringを使えば解決します.
    疲れすぎて、正確な理由が見つからないので、明日ウトコに行って探してみます.
    ルート削除機能は逆削除機能と同じなので、すぐに完了できます.そしてフェルとしばらく雑談して終わりました.

    更新時に404エラーが発生しないように、WebパッケージにhistoryapiFallback:trueオプションを指定します。


    現在、SPA機能を実現するためにルーティング機能が使用されているため、localhost:8080/linesで動作してリフレッシュすると、linesというhtmlがないため404エラーが発生し、ホームページに戻るために/linesを削除する必要がある点が非常に困難である.
    私はそれを直すとは思わなかった.他のクルーがどのようにコードされているかを見て、この問題を解決したクルーたちを見た.そこで、何回かの試行錯誤を経て解決されたことを知らせるように要求した.
    まず、webpack dev-serverが提供するhistoryApiFallback機能があります.ページが見つからず404エラーが発生した場合、この機能はindexです.htmlを返します.また、これもhistory apiを使用する場合に使用できる機能です.
    この場合、既存のルーティングアドレスは変更されません.したがって、htmlが見つからないため404エラー、例えばlocalhost:8080/linesが発生した場合、アドレスは変わらないが、画面はindexである.htmlがあるはずです.
    これにより,window.location.pathnameを用いて/linesと名付けられたpathを取得し,直接ルーティングすればよい.
    const path = window.location.pathname;
    const app = new App();
    
    app.init();
    app.router.route(path);
    app.runPathMatchedAction(path); 
    私のコードではこのように操作されています.pathをインポートしてルーティングし、pathに一致する操作を実行します.これにより、リフレッシュしても元の作業位置に戻るため、コードの実装速度が速くなります.
    私はこれをスレイクに分かち合って、多くのクルーが助けてくれることを望んでいます.(まさか私しか知らないでしょう?)

    Plans

  • 地下鉄路線図二段階区間機能完成及び柏試験実施