TWSNMP MW開発4日目:Windowの表示内容を切り替える方法が見えてきた
浦和レッズ 残念!
昨日、サッカーの試合を観て寝るのが遅くなったので6時近くまで寝てしまいました。助手の猫さんが大騒ぎして起こしてくれました。
昨日の夜、wails v3のマルチWindowとSolid.jsを組み合わせてWindowの表示内容を切り替える方法を考えながら寝ました。思いついたWindowを作成する時のURLにパラメータを渡す方法を試してみした。
app.NewWebviewWindowWithOptions(application.WebviewWindowOptions{
Title: "TWSNMP MV Main",
Mac: application.MacWindow{
Backdrop: application.MacBackdropTranslucent,
},
URL: "/?page=main",
})
app.NewWebviewWindowWithOptions(application.WebviewWindowOptions{
Title: "TWSNMP MV Map SiteName",
Mac: application.MacWindow{
Backdrop: application.MacBackdropTranslucent,
},
URL: "/?page=map&id=1",
})
のようにURLにパラメータを指定して Windowを作成して画面を表示するJSX側で
import 'flowbite';
import { Match, Switch } from 'solid-js';
function App() {
const url = new URL(window.location.href);
const params = url.searchParams;
console.log(params.get("page"));
console.log(params.get("id"));
const page = params.get("page");
const id = params.get("page");
return (
<>
<Switch>
<Match when={page =="main"} >
<p class="text-4xl text-red-600">Main Page</p>
</Match>
<Match when={page =="map"} >
<p class="text-4xl text-blue-600">MAP Page id={id}</p>
</Match>
</Switch>
</>
)
}
export default App
のように受け取るようにすることでWindowの表示内容を変えることができました。
本当に、これでよいか不安なところもありますが、wailsのruntimeのソースコードなどを調べた限りでは、この方法が今の時点では良いのかと思っています。
ここまでできたところで今朝は時間切れです。
明日に続く
開発のための諸経費(機材、Appleの開発者、サーバー運用)に利用します。 ソフトウェアのマニュアルをnoteの記事で提供しています。 サポートによりnoteの運営にも貢献できるのでよろしくお願います。