学习总结1

Vue的学习

Vue是一套用于构建用户界面的渐进式JavaScript框架;

Vue中关键的几个概念:组件化MVVM响应式,和生命周期

1. 组件化:

在Vue框架中,允许你将界面拆分为小的,独立的可重复使用的组件,每个组件有自己的样式,逻辑,这样可以简化复杂网站的开发和维护

2. MVVM

MVVM (Model-View-ViewModel) 是一种设计模式,Model表示数据,View表示界面,ViewModel作为链接Model和View的桥梁,处理View的显示逻辑,并将用户的交互转化为对Model的操作

3. 响应式

响应式就是当一个DOM元素绑定了响应式数据的时候,当数据发生变化的时候,相关的DOM自动更新以反映这些变化。 

 4. 生命周期

生命周期描述了一个组件从创建到销毁的整个过程,包括创建,挂载,更新和销毁等阶段,我们可以使用生命周期钩子函数来在不同阶段执行自定义代码。

学习了Vue中的一些知识点:

条件语句( v-if ),循环语句( v-for ),组件,计算属性( computed ),监听属性( watch ),样式绑定,绑定事件,表单( v-model ),自定义指令,路由( router ),axios

在学习过程中,比较难的几个方面是组件中的数据传递路由中的多级路由配置;

组件中的数据传递:子传父,父传子,provide 和 inject 实现跨组件通信;

路由中的多级路由配置:一级路由和多级路由,使用 children 来创建多级路由;

还学习了很多厉害的动态效果。

SpringBoot学习

使用SpringBoot的优点:1. 基于Spring 4,2. 简化编码,3. 简化配置,4. 简化部署,5. 简化监控但是由于我之前没有学习过Spring,所以有很多注解只晓得要用,不晓得到底有什么用,这是后面还要进行学习的地方。

这周尝试实现了前后端交互,刚开始前端发送请求过去后端一直接收不到,然后搞了好久才晓得是要配置跨域申请,然后还有要注意的就是前端发送get请求的时候是使用@RequestParam()注解,Post请求后端在接受的时候要使用@RequestBody注解来接收数据。

axios.get('http://localhost:8081/findAll').then(function (response) {let data = response.data.students; // 提取响应中的数据console.log(data); // 在控制台查看数据tableData.value = data;}).catch(function (error) {console.error('获取学生数据时出错:', error);});
    @GetMapping("/findAll")public String findAll(){List<Student> allStudent = studentMapper.findAllStudent();System.out.println(allStudent);Map<String,Object> data=new HashMap<>();data.put("students",allStudent);Gson gson=new Gson();String json = gson.toJson(data);return json;}

删除成员

const deleteById = (row) => {ElMessageBox.confirm('确定要删除吗?', '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning',}).then(() => {// 点击确定按钮时的逻辑axios.post("http://localhost:8081/deleteById", {id:row.id}).then((resp) => {console.log(resp);ElMessage({message: "删除成功",type: 'success' // 消息类型,可选值有 success(成功)、warning(警告)、info(一般信息)、error(错误)});const index = tableData.value.findIndex(item => item.id === row.id);if (index !== -1) {tableData.value.splice(index, 1); // 从tableData数组中删除相应的数据项}}).catch((error) => {console.error(error);});}).catch(() => {// 点击取消按钮时的逻辑console.log('取消删除');});}
@PostMapping("/deleteById")public String delete(@RequestBody Map<String,String> map){int id = Integer.parseInt(map.get("id"));studentMapper.deleteById(id);return "删除成功";}

然后还学习了MybatisPlus,Vuex,piain,都学了一个大概,会基本的用法了,还未深入的去了解这些知识。

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

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

相关文章

starrocks启动和停止和重启脚本

StarRocks启动和停止和重启脚本 编辑脚本&#xff1a;vim start_stop_starrocks.sh 备注:IP修改为自己的IP即可 #!/bin/bashcase $1 in "start"){for i in 12.3.7.147 12.3.7.148 12.3.7.149 12.3.7.150doecho " --------启动 $i be -------"ssh $i &qu…

node.js知识系列(1)-每天了解一点

目录 1. Node.js 是什么以及其主要特点2. 事件循环&#xff08;Event Loop&#xff09;和其作用3. 处理回调地狱&#xff08;Callback Hell&#xff09;4. 包管理器和 npm5. 模块系统和导入/导出模块6. 文件操作7. 事件发射器&#xff08;EventEmitter&#xff09;8. 处理异常和…

Vue3+TypeScript

一、Vue3带来的变化(源码&#xff09; 源码通过monorepo的形式来管理源代码 口Mono:单个 口Repo : repository仓库 口主要是将许多项目的代码存储在同一个repository中; 口这样做的目的是多个包本身相互独立&#xff0c;可以有自己的功能逻辑、单元测试等&#xff0c;同时又在…

【数据库开发】DQL操作和多表设计

数据库开发 一、数据库操作-DQL 1.概述 用来查询数据库表中的记录&#xff0c;查询操作分为两部分&#xff0c;单表操作和多表操作&#xff0c;针对于查询而言&#xff08;相较于增删改更加的灵活&#xff09;基于目标分析条件转换为SQL语句 2.语法 SELECT 字段列表 FROM表…

基于安卓android微信小程序的旅游app系统

项目介绍 随着人民生活水平的提高,旅游业已经越来越大众化,而旅游业的核心是信息,不论是对旅游管理部门、对旅游企业,或是对旅游者而言,有效的获取旅游信息,都显得特别重要.自助定制游将使旅游相关信息管理工作规范化、信息化、程序化,提供旅游景点、旅游线路,旅游新闻等服务本…

Java线程池:并发编程的利器

Java线程池&#xff1a;并发编程的利器 在多任务、高并发的时代&#xff0c;Java并发编程显得尤为重要。其中&#xff0c;Java线程池是一种高效的管理线程的工具&#xff0c;能够提高应用程序的性能和响应速度。本文将深入探讨Java线程池的工作原理、应用场景以及简单示例&…

SpringBoot整合POI实现Excel文件读写操作

1.环境准备 1、导入sql脚本&#xff1a; create database if not exists springboot default charset utf8mb4;use springboot;create table if not exists user (id bigint(20) primary key auto_increment comment 主键id,username varchar(255) not null comment 用…

10.5 认识XEDParse汇编引擎

XEDParse 是一款开源的x86指令编码库&#xff0c;该库用于将MASM语法的汇编指令级转换为对等的机器码&#xff0c;并以XED格式输出&#xff0c;目前该库支持x86、x64平台下的汇编编码&#xff0c;XEDParse的特点是高效、准确、易于使用&#xff0c;它可以良好地处理各种类型的指…

学习笔记(css穿透、vue-cookie、拦截器、vuex、导航守卫、token/Cookie、正则校验)

目录 一、记录 1、CSS穿透 2、输入框是否提示输入 3、插槽 #slot 4、v-deep深入改掉属性值 二、vue-cookie 1、官方文档 2、使用 三、拦截器 1、请求拦截器 2、响应拦截器 四、vuex对信息存取改 五、路由导航守卫 1、登录思路 2、设置白名单 六、Token与Cookie…

蓝桥杯每日一题2023.9.30

蓝桥杯大赛历届真题 - C&C 大学 B 组 - 蓝桥云课 (lanqiao.cn) 题目描述 题目分析 对于此题&#xff0c;首先想到了dfs进行一一找寻&#xff0c;注意每次不要将重复的算进去&#xff0c;故我们每次循环可以记录一个开始的位置&#xff0c;下一次到这个位置时&#xff0c;…

WIFI频段

问题&#xff1a; 5ghzwifi频段带宽怎么选 智造喵回答&#xff1a; 选择5GHz WiFi频段的带宽取决于你的网络需求和设备兼容性。通常有两种可选的带宽&#xff1a;20MHz和40MHz。 20MHz带宽&#xff1a;这是较为常见的 WiFi 频段带宽设置。它提供较好的穿墙能力和信号稳定性…

【MySQL基础】概述、DDL和DML

MySQL基础 1.MySQL概述 安装 MySQL官方提供了两个版本&#xff1a; 商业版本&#xff08;MySQL Enterprise Edition&#xff09; 该版本是收费的&#xff0c;可以使用30天。 官方会提供对应的技术支持。 社区版本&#xff08;MySQL Community Server&#xff09; 该版本是免费…

【数据结构-二叉树 九】【树的子结构】:树的子结构

废话不多说&#xff0c;喊一句号子鼓励自己&#xff1a;程序员永不失业&#xff0c;程序员走向架构&#xff01;本篇Blog的主题是【子结构】&#xff0c;使用【二叉树】这个基本的数据结构来实现&#xff0c;这个高频题的站点是&#xff1a;CodeTop&#xff0c;筛选条件为&…

软考程序员考试大纲(2023)

文章目录 前言一、考试说明1.考试目标2.考试要求3&#xff0e;考试科目设置 二、考试范围考试科目1&#xff1a;计算机与软件工程基本知识1&#xff0e;计算机科学基础2&#xff0e;计算机系统基础知识3&#xff0e;系统开发和运行知识4&#xff0e;网络与信息安全基础知识5&am…

WebKit Inside: CSS 样式表的匹配时机

WebKit Inside: CSS 的解析 介绍了 CSS 样式表的解析过程&#xff0c;这篇文章继续介绍 CSS 的匹配时机。 无外部样式表 内部样式表和行内样式表本身就在 HTML 里面&#xff0c;解析 HTML 标签构建 DOM 树时内部样式表和行内样式就会被解析完毕。因此如果 HTML 里面只有内部样式…

【Qt】顶层窗口和普通窗口区别以及用法

区别 在Qt项目开发中&#xff0c;经常会用到窗体控件用于显示及数据操作和其他交互等。 但&#xff0c;窗体分为顶层窗口&#xff08;Top-level Window&#xff09;和普通窗口&#xff08;Regular Window&#xff09;。 他们之间是有区别的&#xff0c;包括在项目实际中的用法…

导出word文件 表格file-saver、html-docx-js-typescript

根据html代码转换为word文件 1、下载file-saver、html-docx-js-typescript npm install file-saver html-docx-js-typescript2、 <span click"downloadWordWithHtmlString()">导出doc</span> <div id"eltable" ref"eltable" st…

【力扣面试题】URL化

&#x1f451;专栏内容&#xff1a;力扣刷题⛪个人主页&#xff1a;子夜的星的主页&#x1f495;座右铭&#xff1a;前路未远&#xff0c;步履不停 目录 一、题目描述二、题目分析1、使用String内部方法2、使用StringBuilder 一、题目描述 题目链接&#xff1a;URL化 编写一种…

邮件群发工具哪个好

邮件群发是一种通过电子邮件向多个收件人发送邮件的方式。同时&#xff0c;邮件群发也是一种低成本、高回报的营销手段。因此邮件群发被广泛应用于各种营销活动中&#xff0c;例如活动邀请、新品上线、产品促销等等。而群发邮件最有效的方式就是借助邮件群发工具&#xff0c;而…

业务测试常见问题(一)

如何多维度的分析一个需求&#xff1f; 功能维度&#xff1a;需求中所描述的功能是否实现&#xff0c;与用户的需求是否一致&#xff0c;是否完整符合用户的需求等。 安全性维度&#xff1a;是否有安全漏洞&#xff0c;是否存在未授权访问漏洞等&#xff0c;以保证系统的安全性…