第三篇【传奇开心果系列】Vant开发移动应用：财务管理应用

传奇开心果博文系列

  • 系列博文目录
    • Vant开发移动应用系列博文
  • 博文目录
    • 一、项目目标
    • 二、编程思路
    • 三、初步实现示例代码
    • 四、扩展思路
    • 五、使用Firebase等后端服务来实现用户认证和数据存储示例代码
    • 六、用Vant组件库实现收入和支出分类管理的示例代码
    • 七、用Vant组件库实现收入和支出的编辑和删除功能的示例代码
    • 八、用Vant组件库实现财务报表定制功能的示例代码
    • 九、用Vant组件库实现财务图表交互和定制功能的示例代码
    • 十、把Vant 实现的财务管理应用适配不同平台

系列博文目录

Vant开发移动应用系列博文

博文目录

一、项目目标

在这里插入图片描述在这里插入图片描述使用vant实现财务管理应用：创建一个简单的财务管理应用，用户可以记录和跟踪他们的收入和支出，并生成报表和图表展示财务状况。

二、编程思路

在这里插入图片描述1. 首先，安装并引入Vant组件库，以便使用Vant提供的丰富组件来构建财务管理应用界面。

  1. 创建一个首页，包括收入、支出、报表和图表四个主要功能入口。使用Vant提供的按钮组件来实现这些功能入口。

  2. 在收入和支出功能入口中，使用Vant提供的表单组件来让用户输入收入和支出的相关信息，如金额、日期、类别等。

  3. 使用Vant的弹出层组件来实现一个确认对话框，让用户确认他们输入的收入和支出信息。

  4. 在报表功能入口中，使用Vant提供的表格组件来展示用户输入的收入和支出信息，并计算总收入和总支出。

  5. 在图表功能入口中，使用Vant提供的图表组件来展示用户的收入和支出情况，可以选择不同的图表类型，如饼图、柱状图等。

  6. 使用Vant提供的布局组件来优化界面布局，使得用户界面更加美观和易用。

  7. 最后，进行测试和优化，确保财务管理应用能够稳定运行并满足用户需求。

通过以上步骤，我们可以使用Vant组件库快速构建一个简单的财务管理应用，让用户可以方便地记录和跟踪他们的收入和支出，并通过报表和图表展示财务状况。

三、初步实现示例代码

在这里插入图片描述以下是一个简单的示例代码，使用Vant组件库来实现财务管理应用的部分功能：

<template><div><van-button @click="showIncomeForm">记录收入</van-button><van-button @click="showExpenseForm">记录支出</van-button><van-button @click="showReport">查看报表</van-button><van-button @click="showChart">查看图表</van-button><van-popup v-model="showIncomePopup" position="bottom"><van-form><van-field v-model="incomeAmount" label="金额" type="number" /><van-field v-model="incomeCategory" label="类别" /><van-button @click="saveIncome">保存</van-button></van-form></van-popup><van-popup v-model="showExpensePopup" position="bottom"><van-form><van-field v-model="expenseAmount" label="金额" type="number" /><van-field v-model="expenseCategory" label="类别" /><van-button @click="saveExpense">保存</van-button></van-form></van-popup><van-cell-group><van-cell title="总收入" :value="totalIncome" /><van-cell title="总支出" :value="totalExpense" /></van-cell-group><van-chart :data="chartData" type="line" /></div>
</template><script>
export default {data() {return {showIncomePopup: false,showExpensePopup: false,incomeAmount: 0,incomeCategory: '',expenseAmount: 0,expenseCategory: '',totalIncome: 0,totalExpense: 0,chartData: {labels: ['1月', '2月', '3月', '4月', '5月', '6月'],datasets: [{data: [1000, 2000, 1500, 3000, 2000, 1200],},],},};},methods: {showIncomeForm() {this.showIncomePopup = true;},showExpenseForm() {this.showExpensePopup = true;},saveIncome() {// 保存收入信息的逻辑this.showIncomePopup = false;},saveExpense() {// 保存支出信息的逻辑this.showExpensePopup = false;},showReport() {// 查看报表的逻辑},showChart() {// 查看图表的逻辑},},
};
</script>

在这个示例代码中，我们使用了Vant组件库中的按钮、弹出层、表单、单元格和图表等组件来实现了记录收入和支出、查看报表和图表的功能。当用户点击记录收入或支出按钮时，会弹出相应的表单，用户可以输入相关信息并保存。同时，页面上展示了总收入、总支出和图表数据。

四、扩展思路

在这里插入图片描述当扩展财务管理应用时，可以考虑以下几个方面：

  1. 用户认证和数据存储：引入用户认证功能，让用户可以注册账号并登录，以便将他们的财务数据与个人账户相关联。可以使用Firebase等后端服务来实现用户认证和数据存储。

  2. 收入和支出分类管理：允许用户创建自定义的收入和支出分类，例如餐饮、交通、日常用品等，以便更好地统计和分析财务数据。

  3. 收入和支出的编辑和删除：在记录收入和支出后，用户可能需要对已有的数据进行编辑或删除操作，因此需要提供相应的功能。

  4. 财务报表的定制：除了展示总收入和总支出外，还可以实现更多财务报表，如月度收支对比、分类统计等，让用户可以更全面地了解自己的财务状况。

  5. 财务图表的交互和定制：在图表功能中，可以增加交互功能，让用户可以根据需要自定义图表的展示内容和样式，如选择特定时间范围、对比不同分类等。

  6. 多平台适配：考虑将财务管理应用适配到不同平台，如Web、iOS和Android，可以使用Vue的跨平台框架，如Vue Native或Vue.js + Cordova等。

  7. 数据同步和备份：提供数据同步和备份功能，确保用户的财务数据不会丢失，并可以在多个设备上访问和管理。

通过以上扩展，可以让财务管理应用更加全面和实用，满足用户对财务管理的各种需求。

五、使用Firebase等后端服务来实现用户认证和数据存储示例代码

在这里插入图片描述下面是一个简单的示例代码，演示如何使用Firebase实现用户认证和数据存储功能。在这个示例中，我们将使用Firebase Authentication来实现用户注册和登录，以及使用Firebase Realtime Database来存储用户的财务数据。

<template><div><van-button @click="register">注册</van-button><van-button @click="login">登录</van-button></div>
</template><script>
import firebase from 'firebase/app';
import 'firebase/auth';
import 'firebase/database';export default {methods: {register() {firebase.auth().createUserWithEmailAndPassword('user@example.com', 'password').then((userCredential) => {// 注册成功，可以在此处初始化用户的财务数据const userId = userCredential.user.uid;const userData = {income: 0,expense: 0,// 其他财务数据...};firebase.database().ref('users/' + userId).set(userData);}).catch((error) => {// 处理注册失败的情况const errorCode = error.code;const errorMessage = error.message;});},login() {firebase.auth().signInWithEmailAndPassword('user@example.com', 'password').then((userCredential) => {// 登录成功，可以跳转到财务管理页面const userId = userCredential.user.uid;// 在这里可以获取用户的财务数据并展示firebase.database().ref('users/' + userId).once('value', (snapshot) => {const userData = snapshot.val();// 处理用户的财务数据...});}).catch((error) => {// 处理登录失败的情况const errorCode = error.code;const errorMessage = error.message;});},},created() {// 初始化Firebaseconst firebaseConfig = {apiKey: "YOUR_API_KEY",authDomain: "YOUR_AUTH_DOMAIN",databaseURL: "YOUR_DATABASE_URL",projectId: "YOUR_PROJECT_ID",storageBucket: "YOUR_STORAGE_BUCKET",messagingSenderId: "YOUR_MESSAGING_SENDER_ID",appId: "YOUR_APP_ID"};firebase.initializeApp(firebaseConfig);},
};
</script>

在这个示例中，我们使用了Firebase的Authentication模块来实现用户注册和登录功能，以及使用Realtime Database来存储用户的财务数据。在注册成功后，我们会在数据库中为用户创建一个新的数据节点，并初始化用户的财务数据。在登录成功后，我们会根据用户的uid来获取用户的财务数据，并进行相应的展示和处理。当然，在实际应用中，还需要考虑更多的安全性和错误处理等情况。

六、用Vant组件库实现收入和支出分类管理的示例代码

在这里插入图片描述以下是一个使用Vant组件库实现收入和支出分类管理的示例代码。在这个示例中，我们将使用Vant的UI组件来创建一个用户友好的界面，让用户可以轻松地添加和管理收入和支出分类。

<template><div><van-cell-group><van-cell v-for="category in incomeCategories" :key="category.id" :title="category.name" is-link @click="editIncomeCategory(category)" /></van-cell-group><van-field v-model="newIncomeCategory" label="添加收入分类" placeholder="请输入收入分类" /><van-button type="primary" @click="addIncomeCategory">添加</van-button><van-cell-group><van-cell v-for="category in expenseCategories" :key="category.id" :title="category.name" is-link @click="editExpenseCategory(category)" /></van-cell-group><van-field v-model="newExpenseCategory" label="添加支出分类" placeholder="请输入支出分类" /><van-button type="primary" @click="addExpenseCategory">添加</van-button></div>
</template><script>
import firebase from 'firebase/app';
import 'firebase/database';export default {data() {return {newIncomeCategory: '',newExpenseCategory: '',incomeCategories: [],expenseCategories: [],};},methods: {addIncomeCategory() {const newCategory = {name: this.newIncomeCategory,};firebase.database().ref('incomeCategories').push(newCategory);this.newIncomeCategory = ''; // 清空输入框},addExpenseCategory() {const newCategory = {name: this.newExpenseCategory,};firebase.database().ref('expenseCategories').push(newCategory);this.newExpenseCategory = ''; // 清空输入框},editIncomeCategory(category) {// 编辑收入分类的逻辑},editExpenseCategory(category) {// 编辑支出分类的逻辑},},created() {// 从数据库中获取收入和支出分类firebase.database().ref('incomeCategories').on('value', (snapshot) => {this.incomeCategories = [];snapshot.forEach((childSnapshot) => {const category = {id: childSnapshot.key,name: childSnapshot.val().name,};this.incomeCategories.push(category);});});firebase.database().ref('expenseCategories').on('value', (snapshot) => {this.expenseCategories = [];snapshot.forEach((childSnapshot) => {const category = {id: childSnapshot.key,name: childSnapshot.val().name,};this.expenseCategories.push(category);});});},
};
</script>

在这个示例中，我们使用了Vant组件库中的van-cell-group、van-cell和van-field等组件来创建收入和支出分类管理界面。用户可以通过输入框添加新的收入和支出分类，并将其保存到数据库中。同时，我们在created生命周期钩子中监听数据库的变化，以便在数据发生变化时及时更新页面上的分类列表。

请注意，示例代码中的编辑分类的逻辑需要根据实际需求进行实现。

七、用Vant组件库实现收入和支出的编辑和删除功能的示例代码

在这里插入图片描述以下是一个使用Vant组件库实现收入和支出的编辑和删除功能的示例代码。在这个示例中，我们将使用Vant的UI组件来创建一个用户友好的界面，让用户可以轻松地编辑和删除已有的收入和支出记录。

<template><div><van-cell-group><van-cell v-for="income in incomes" :key="income.id" :title="income.name" :label="income.amount" is-link @click="editIncome(income)" /></van-cell-group><van-cell-group><van-cell v-for="expense in expenses" :key="expense.id" :title="expense.name" :label="expense.amount" is-link @click="editExpense(expense)" /></van-cell-group></div>
</template><script>
import firebase from 'firebase/app';
import 'firebase/database';export default {data() {return {incomes: [],expenses: [],};},methods: {editIncome(income) {// 编辑收入记录的逻辑},editExpense(expense) {// 编辑支出记录的逻辑},deleteIncome(income) {firebase.database().ref('incomes').child(income.id).remove();},deleteExpense(expense) {firebase.database().ref('expenses').child(expense.id).remove();},},created() {// 从数据库中获取收入和支出记录firebase.database().ref('incomes').on('value', (snapshot) => {this.incomes = [];snapshot.forEach((childSnapshot) => {const income = {id: childSnapshot.key,name: childSnapshot.val().name,amount: childSnapshot.val().amount,};this.incomes.push(income);});});firebase.database().ref('expenses').on('value', (snapshot) => {this.expenses = [];snapshot.forEach((childSnapshot) => {const expense = {id: childSnapshot.key,name: childSnapshot.val().name,amount: childSnapshot.val().amount,};this.expenses.push(expense);});});},
};
</script>

在这个示例中，我们使用了Vant组件库中的van-cell-group和van-cell组件来展示收入和支出记录，并提供编辑和删除功能。用户可以点击列表中的记录来编辑它们，并可以通过滑动操作来删除记录。在created生命周期钩子中，我们监听了数据库的变化，以便在数据发生变化时及时更新页面上的记录列表。

请注意，示例代码中的编辑和删除记录的逻辑需要根据实际需求进行实现。

八、用Vant组件库实现财务报表定制功能的示例代码

在这里插入图片描述以下是一个使用Vant组件库实现财务报表定制功能的示例代码。在这个示例中，我们将展示总收入和总支出，并提供月度收支对比和分类统计的功能，让用户可以更全面地了解自己的财务状况。

<template><div><van-cell-group><van-cell title="总收入" :label="totalIncome" /><van-cell title="总支出" :label="totalExpense" /></van-cell-group><van-divider>月度收支对比</van-divider><van-chart:data="monthlyData"type="line":xAxis="{type: 'category',data: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']}":yAxis="{ type: 'value' }"/><van-divider>分类统计</van-divider><van-cell-group><van-cell v-for="category in expenseCategories" :key="category.id" :title="category.name" :label="getCategoryTotal(category.id)" /></van-cell-group></div>
</template><script>
import firebase from 'firebase/app';
import 'firebase/database';export default {data() {return {totalIncome: 0,totalExpense: 0,monthlyData: [],expenseCategories: [],categoryTotals: {},};},methods: {getCategoryTotal(categoryId) {return this.categoryTotals[categoryId] || 0;},},created() {// 获取总收入和总支出firebase.database().ref('totalIncome').on('value', (snapshot) => {this.totalIncome = snapshot.val();});firebase.database().ref('totalExpense').on('value', (snapshot) => {this.totalExpense = snapshot.val();});// 获取月度收支对比数据firebase.database().ref('monthlyData').on('value', (snapshot) => {this.monthlyData = snapshot.val();});// 获取支出分类和分类统计firebase.database().ref('expenseCategories').on('value', (snapshot) => {this.expenseCategories = [];snapshot.forEach((childSnapshot) => {const category = {id: childSnapshot.key,name: childSnapshot.val().name,};this.expenseCategories.push(category);});firebase.database().ref('categoryTotals').on('value', (snapshot) => {this.categoryTotals = snapshot.val();});});},
};
</script>

在这个示例中，我们使用了Vant组件库中的van-cell-group、van-cell、van-divider和van-chart等组件来创建财务报表定制界面。用户可以在界面上看到总收入和总支出的数据，并可以通过折线图展示月度收支对比，以及通过列表展示支出分类的统计数据。在created生命周期钩子中，我们监听了数据库的变化，以便在数据发生变化时及时更新页面上的报表数据。

请注意，示例代码中的财务报表数据和展示方式需要根据实际需求进行实现。

九、用Vant组件库实现财务图表交互和定制功能的示例代码

在这里插入图片描述以下是一个使用Vant组件库实现财务图表交互和定制功能的示例代码。在这个示例中，我们将展示如何使用Vant组件库中的van-popup、van-datetime-picker和van-radio-group等组件来实现交互和定制功能，让用户可以根据需要自定义图表的展示内容和样式。

<template><div><van-popup v-model="showFilterPopup" position="bottom"><div style="padding: 16px;"><van-datetime-pickerv-model="selectedDate"type="date"title="选择日期范围":min-date="minDate":max-date="maxDate"/><van-radio-group v-model="selectedCategory"><van-cell-group><van-cell v-for="category in expenseCategories" :key="category.id">{{ category.name }}<van-radio :name="category.id" /></van-cell></van-cell-group></van-radio-group><van-button type="primary" @click="applyFilters">应用</van-button></div></van-popup><van-chart:data="filteredChartData"type="line":xAxis="{ type: 'category', data: filteredChartLabels }":yAxis="{ type: 'value' }"/><van-button type="info" @click="showFilterPopup = true">自定义图表</van-button></div>
</template><script>
import firebase from 'firebase/app';
import 'firebase/database';export default {data() {return {showFilterPopup: false,selectedDate: new Date(),minDate: new Date(2020, 0, 1),maxDate: new Date(),selectedCategory: [],expenseCategories: [],chartData: [],chartLabels: [],};},computed: {filteredChartData() {// 根据选择的日期和分类过滤图表数据// 从数据库中获取相应的数据进行处理return this.chartData;},filteredChartLabels() {// 根据选择的日期和分类过滤图表标签// 从数据库中获取相应的数据进行处理return this.chartLabels;},},methods: {applyFilters() {// 应用用户选择的日期和分类过滤图表数据// 更新图表数据this.showFilterPopup = false;},},created() {// 获取支出分类firebase.database().ref('expenseCategories').on('value', (snapshot) => {this.expenseCategories = [];snapshot.forEach((childSnapshot) => {const category = {id: childSnapshot.key,name: childSnapshot.val().name,};this.expenseCategories.push(category);});});// 获取初始图表数据// 从数据库中获取相应的数据进行处理this.chartData = [];this.chartLabels = [];},
};
</script>

在这个示例中，我们使用了Vant组件库中的van-popup、van-datetime-picker、van-radio-group和van-chart等组件来创建财务图表交互和定制界面。用户可以通过点击按钮打开弹出层，选择日期范围和分类，然后点击"应用"按钮来应用选择的过滤条件，更新图表的展示内容。在created生命周期钩子中，我们监听了数据库的变化，以便在数据发生变化时及时更新页面上的图表数据。

请注意，示例代码中的财务图表数据和交互逻辑需要根据实际需求进行实现。

十、把Vant 实现的财务管理应用适配不同平台

在这里插入图片描述在将财务管理应用适配到不同平台时，可以考虑使用Vue的跨平台框架，例如Vue Native或Vue.js + Cordova。下面分别介绍如何使用这两种框架来实现多平台适配。

使用Vue Native

Vue Native是一个基于Vue.js的框架，可以让你使用Vue.js编写原生移动应用。它使用React Native的组件来构建原生应用界面，因此可以在iOS和Android平台上运行。以下是一个简单的示例代码，演示如何使用Vue Native来实现财务管理应用的界面。

<template><view><!-- 财务管理应用界面 --><van-popup v-model="showFilterPopup" position="bottom"><!-- ... 其他界面组件 ... --></van-popup><van-chart:data="filteredChartData"type="line":xAxis="{ type: 'category', data: filteredChartLabels }":yAxis="{ type: 'value' }"/><van-button type="info" @click="showFilterPopup = true">自定义图表</van-button></view>
</template><script>
import { Popup, Chart, Button } from 'vant';
export default {components: {VanPopup: Popup,VanChart: Chart,VanButton: Button,},data() {return {showFilterPopup: false,// ... 其他数据 ...};},// ... 其他逻辑 ...
};
</script>

使用Vue.js + Cordova

另一种方法是使用Vue.js结合Cordova来实现多平台适配。Cordova是一个移动应用开发框架，可以使用HTML、CSS和JavaScript来构建跨平台的移动应用。以下是一个简单的示例代码，演示如何使用Vue.js + Cordova来实现财务管理应用的界面。

<template><div><!-- 财务管理应用界面 --><van-popup v-model="showFilterPopup" position="bottom"><!-- ... 其他界面组件 ... --></van-popup><van-chart:data="filteredChartData"type="line":xAxis="{ type: 'category', data: filteredChartLabels }":yAxis="{ type: 'value' }"/><van-button type="info" @click="showFilterPopup = true">自定义图表</van-button></div>
</template><script>
import { Popup, Chart, Button } from 'vant';
export default {components: {VanPopup: Popup,VanChart: Chart,VanButton: Button,},data() {return {showFilterPopup: false,// ... 其他数据 ...};},// ... 其他逻辑 ...
};
</script>

在使用Cordova的情况下，你需要将Vue.js应用打包为一个Cordova项目，并使用Cordova的插件来访问设备功能。然后你可以将打包好的应用分别发布到iOS和Android平台。

在这里插入图片描述无论你选择使用Vue Native还是Vue.js + Cordova，都需要根据不同平台的特性来调整应用的布局和功能，确保应用在不同平台上都能正常运行和展示。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/638747.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

Redis经典五大类型源码及底层实现

Redis经典五大类型源码及底层实现

Redis经典五大类型源码及底层实现分析 1、一些题目 redis的zset底层实现&#xff1f;redis的跳表和压缩列表说一下&#xff0c;解决了哪些问题&#xff0c;时间复杂度和空间复杂度如何&#xff1f;redis的zset使用的是什么数据结构&#xff1f; Redis数据类型的底层数据结构…
阅读更多...
《WebKit 技术内幕》之五（1）： HTML解释器和DOM 模型

《WebKit 技术内幕》之五（1）： HTML解释器和DOM 模型

第五章 HTML 解释器和 DOM 模型 1.DOM 模型 1.1 DOM标准 DOM &#xff08;Document Object Model&#xff09;的全称是文档对象模型&#xff0c;它可以以一种独立于平台和语言的方式访问和修改一个文档的内容和结构。这里的文档可以是 HTML 文档、XML 文档或者 XHTML 文档。D…
阅读更多...
python基本数据类型 - 字典集合

python基本数据类型 - 字典集合

引入 在内存中存储的数据可以是不同的数据类型。比如名字可以使用字符串存储&#xff0c;年龄可以使用数字存储&#xff0c;python有6种基本数据类型&#xff0c;用于各种数据的存储&#xff0c;分别是&#xff1a;numbers(数字类型)、string(字符串)、List(列表)、Tuple(元组…
阅读更多...
【笔记】Blender4.0建模入门-3物体的基本操作

【笔记】Blender4.0建模入门-3物体的基本操作

Blender入门 ——邵发 3.1 物体的移动 演示&#xff1a; 1、选中一个物体 2、选中移动工具 3、移动 - 沿坐标轴移动 - 在坐标平面内移动 - 自由移动&#xff08;不好控制&#xff09; 选中物体&#xff1a;右上的大纲窗口&#xff0c;点击物体名称&#xff0c;物体的轮…
阅读更多...
文件操作（上）

文件操作（上）

目录 文件的必要性&#xff1a; 文件分类&#xff1a; 程序文件&#xff1a; 数据文件&#xff1a; 文件的打开与关闭&#xff1a; fopen函数分析: ​编辑 FILE*: char*filename: char*mode: fclose函数&#xff1a; 应用&#xff1a; 文件编译 Fgetc Fputc 应用…
阅读更多...
HNU-数据挖掘-作业1

HNU-数据挖掘-作业1

数据挖掘课程作业作业1 计科210X 甘晴void 202108010XXX 第一题 假设所分析的数据包括属性 age,它在数据元组中的值&#xff08;以递增序&#xff09;为13 ,15 ,16 ,16 ,19 ,20 ,20 ,21 ,22 ,22 ,25 ,25 ,25 ,25 ,30 ,33 ,33 ,35 ,35 ,35 ,35 ,36 ,40 ,45 ,46 ,52,70。 a.…
阅读更多...
基于Unity平台开发Vision Pro应用

基于Unity平台开发Vision Pro应用

VisionOS是苹果最新空间计算设备Vision Pro的操作系统。Unity开发人员可以利用现有的3D场景 以及为 visionOS 构建游戏或应用程序的资产。有关 visionOS 的更多信息&#xff0c;请参阅 Apple 的 visionOS 概述。 visionOS提供了几种不同的显示应用程序的模式&#xff1a;Windo…
阅读更多...
【网站项目】基于SSM的274办公自动化管理系统

【网站项目】基于SSM的274办公自动化管理系统

&#x1f64a;作者简介&#xff1a;多年一线开发工作经验&#xff0c;分享技术代码帮助学生学习&#xff0c;独立完成自己的项目或者毕业设计。 代码可以私聊博主获取。&#x1f339;赠送计算机毕业设计600个选题excel文件&#xff0c;帮助大学选题。赠送开题报告模板&#xff…
阅读更多...
JVM系列-1.初识JVM

JVM系列-1.初识JVM

&#x1f44f;作者简介&#xff1a;大家好&#xff0c;我是爱吃芝士的土豆倪&#xff0c;24届校招生Java选手&#xff0c;很高兴认识大家&#x1f4d5;系列专栏&#xff1a;Spring原理、JUC原理、Kafka原理、分布式技术原理、数据库技术、JVM原理&#x1f525;如果感觉博主的文…
阅读更多...
异或运算的骚操作，由浅入深拿捏一类型的题

异或运算的骚操作，由浅入深拿捏一类型的题

文章目录 &#x1f680;前言&#x1f680;异或运算的基本用法&#x1f680;一组数中一种数出现了奇数次&#xff0c;其他种数出现了偶数次&#xff0c;找出这个数&#x1f680;一组数中有两种数出现了奇数次&#xff0c;其他种数出现了偶数次&#xff0c;求这两个数✈️得到一个…
阅读更多...
Spring Boot3.2.2整合MyBatis Plus3.5.5

Spring Boot3.2.2整合MyBatis Plus3.5.5

目录 1.前置条件 2.导坐标 3.配置数据源 4.配置mapper扫描路径 5.MyBatis Plus代码生成器整合 1.导坐标 2.编写代码生成逻辑 1.前置条件 已经初始化好一个spring boot项目且版本为3X&#xff0c;项目可正常启动 2.导坐标 <dependency><groupId>com.baomid…
阅读更多...
弹性调度助力企业灵活应对业务变化，高效管理云上资源

弹性调度助力企业灵活应对业务变化，高效管理云上资源

作者&#xff1a;吴昆 什么是弹性调度 云计算时代&#xff0c;企业可以通过云平台获得大量计算资源&#xff0c;并根据业务发展和流量需求的实时变化&#xff0c;灵活调整使用的资源类型与资源量。阿里云提供了多种弹性资源&#xff0c;如云服务器 ECS 和弹性容器实例 ECI&am…
阅读更多...
基于 Spring Boot+MySQL实现的在线考试系统源码+数据库，基于不同类型的客观题,进行自动组卷、批卷等功能的考试系统

基于 Spring Boot+MySQL实现的在线考试系统源码+数据库，基于不同类型的客观题,进行自动组卷、批卷等功能的考试系统

1. 部署相关 1.1. 介绍 一个 JAVA 实现的在线考试系统,主要实现一套基于不同类型的客观题,进行自动组卷、批卷等功能的考试系统&#xff08;没有主观题&#xff09; 1.2. 系统架构 后端技术栈基于 Spring Boot数据库MySQLORMMyBatis & MyBatis-plus缓存Redis、guava的L…
阅读更多...
【Java网络编程02】套接字编程

【Java网络编程02】套接字编程

【Java网络编程02】套接字编程 1. Socket套接字 概念&#xff1a;Socket套接字&#xff0c;就是系统提供用于实现网络通信的技术&#xff0c;是基于TCP/IP协议的网络通信基本操作单元。基于Socket套接字的网络程序开发就是网络编程。 分类&#xff1a; 我们可以把Socket套接字…
阅读更多...
docker 部署 sentinel

docker 部署 sentinel

docker 部署 sentinel 环境安装 拉取镜像 目前稳定的版本是1.8.0 docker pull bladex/sentinel-dashboard:1.8.0启动服务 docker run --name sentinel -p 8858:8858 -td bladex/sentinel-dashboard:1.8.0登录 登录的时候账号和密码都是sentinel
阅读更多...
算法训练营Day45

算法训练营Day45

#Java #动态规划 Feeling and experiences&#xff1a; 最长公共子序列&#xff1a;力扣题目链接 给定两个字符串 text1 和 text2&#xff0c;返回这两个字符串的最长 公共子序列 的长度。如果不存在 公共子序列 &#xff0c;返回 0 。 一个字符串的 子序列 是指这样一个新…
阅读更多...
泛型..

泛型..

1.泛型 所谓泛型 其实就是一种类型参数(我们平常所见到的参数指的就是方法中的参数 他接收有外界传递来的值 然后在方法中进行使用) 并且还提高了代码的复用率 何以见得提高了代码的复用率 其实就是通过对比使用了泛型技术和没有使用泛型技术之间的区别&#xff1a; 以下是没有…
阅读更多...
windows如何切换访问NAS共享文件夹用户

windows如何切换访问NAS共享文件夹用户

从资源管理器对NAS共享文件夹输入用户名与密码进行访问后&#xff0c;想切换访问用户&#xff0c;搜索了一圈&#xff0c;网上介绍的方法都无效&#xff0c;最后只能注销windows7登陆&#xff0c;然后重新登陆&#xff0c;再访问NAS共享时才能切换用户&#xff0c;各位观众如有…
阅读更多...
深度学习记录--Momentum gradient descent

深度学习记录--Momentum gradient descent

Momentum gradient descent 正常的梯度下降无法使用更大的学习率&#xff0c;因为学习率过大可能导致偏离函数范围&#xff0c;这种上下波动导致学习率无法得到提高&#xff0c;速度因此减慢(下图蓝色曲线) 为了减小波动&#xff0c;同时加快速率&#xff0c;可以使用momentum…
阅读更多...
【软件测试】学习笔记-制定性能测试的目标

【软件测试】学习笔记-制定性能测试的目标

之前有同学交流过&#xff0c;在测试执行过程中他并不清楚测试得到的结果到底能不能满足这次活动的需求。经过追问&#xff0c;发现他连本次活动规则涉及的模块和接口都不是十分清楚&#xff0c;像这样的测试就是没有做性能测试目标的分析。虽然说做了性能测试&#xff0c;但几…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023