基于vite3+tauri模拟QQ登录切换窗体|Tauri自定义拖拽|最小/大/关闭

最新推荐文章于 2024-08-09 15:27:35 发布

u012804784

最新推荐文章于 2024-08-09 15:27:35 发布

阅读量1.1k

点赞数 1

分类专栏： android 文章标签：计算机

本文链接：https://blog.csdn.net/u012804784/article/details/127473315

版权

本文介绍了如何使用Tauri和Vue3创建登录窗口并切换到主窗口，详细讲解了Tauri的窗口管理及自定义拖拽区域的实现方法，包括设置`data-tauri-drag-region`属性来实现元素拖动功能，以及创建无边框窗口并设计自定义导航条的操作。通过这些技巧，可以打造更个性化的桌面应用。

摘要由CSDN通过智能技术生成

🚀 优质资源分享 🚀

学习路线指引（点击解锁）	知识定位	人群定位
🧡 Python实战微信订餐小程序 🧡	进阶级	本课程是python flask+微信小程序的完美结合，从项目搭建到腾讯云部署上线，打造一个全栈订餐系统。
💛Python量化交易实战💛	入门级	手把手带你打造一个易扩展、更安全、效率更高的量化交易系统

前两天有给大家分享tauri+vue3快速搭建项目、封装桌面端多开窗口。今天继续来分享tauri创建启动窗口、登录窗口切换到主窗口及自定义拖拽区域的一些知识。希望对想要学习或正在学习的小伙伴有些帮助。

tauri+vue3登录窗口切换主窗口


<template>
    <div>
        <div class="ntMain\_\_cont flex1 flexbox flex-col">
            <div class="nt\_\_lgregWrapper flex1 flexbox flex-col">
                <NavBar transparent />

                <div class="nt\_\_lgregBox flex1">
                    <div class="banner">
                        <h2 class="tit flexbox flex-alignc"><img src="@assets/logo.png" />TAURI-VUE3-CAHTh2>
 <img class="bg" src="/static/skin/bg-banner.jpg" />
 div>
 <div class="forms">
 <form @submit.prevent="handleSubmit">
 <ul class="clearfix">
 <li><input class="iptxt flex1" type="text" v-model="formObj.tel" placeholder="请输入手机号" />li>
 <li><input class="iptxt flex1" type="password" v-model="formObj.pwd" placeholder="请输入密码"/>li>
 ul>
 <div class="btns">
 <el-button type="primary&