当前位置: 首页 > news >正文

vue3学习资料整理

一、一个后端程序员为什么要学习前端?

1.网上找到的学习理由

《Java后端的我也要学Node.js 了》
https://blog.csdn.net/yusimiao/article/details/104689007

《nodejs后端开发的优缺点(nodejs的概念与特征详解)》
https://www.1pindao.com/baike/20159.html

《NodeJS学习总结》
https://blog.csdn.net/qq_42963930/article/details/109783739

2.为什么我也想学?

我对前端的掌握还停留在jquery时代:用ajax发起请求,用jqury填充数据。对已经流行多年的"响应式"一知半解。如果一个后端开发同学不懂流行的前端框架,可能使得接口设计的不合理、工作量评估不够。

举个例子.

两年前我曾参与做过一个保存草稿的功能。用户在正式提交业务数据之前,可以点击“保存”按钮把整个页面的数据存为草稿。用户再次进入该页面可以看到之前填写的数据。

刚开始我认为实现此功能非常容易:1.前端搜集页面上用户修改或填写的数据然后传给后端 2.后端存为草稿 3.要展示草稿时后端把草稿原样返回前端。

这样做听起来没什么问题。

但前端同学不同意这么做。他们要求展示草稿时后端返回的数据结构,必须和用户首次进入业务处理页面时后端给的数据结构一模一样。

为什么前端有如此要求:因为前端采用的是响应式框架,视图和数据双向绑定。后端返回同样数据结构,前端就能较容易地展示出来。采用jquery,找到页面上的html 元素,然后修改其内容的做法早已过时。

二、怎么学?

1.网上找资料

 
《怎么在Vue3中正确使用ElementPlus,亲测有效,避坑》
https://blog.csdn.net/qq_44017116/article/details/127713704

《vue3使用element-plus》
https://blog.csdn.net/m0_66492535/article/details/128048780

《vue3+element plus+mockjs+echarts手把手搭建一个简易框架代码》
https://blog.csdn.net/liuxin00020/article/details/125082980

《Vue 3 结合TypeScript与Bootstrap、element-plus开发实践》
http://ischoolcode.cn/post/157

2.看书、看教程

书名:《Vue.js 3.x快速入门》 作者:申思维;杜骁

 书名:《Vue.js 3.x高效前端开发(视频教学版)》作者:李小威

菜鸟教程

https://www.runoob.com/vue3/vue3-tutorial.html

3.动手敲代码

我本来想搞一个blog系统,但没那么容易。搞了几天,从安装nodejs开始,用vue3 、elementplus、axios、mockjs搞了一个简单的能跑起来的工程。熟悉前端的同学可能只需半个小时,我却搞了快十天,遇到不少问题。我是从零开始,基本上一行一行地敲的代码。代码在此:https://github.com/yongninghe/vue3-blog-front  仅对前端小白有参考价值。准备以后逐步完善。

相关文章:

vue3学习资料整理

一、一个后端程序员为什么要学习前端? 1.网上找到的学习理由 《Java后端的我也要学Node.js 了》 https://blog.csdn.net/yusimiao/article/details/104689007 《nodejs后端开发的优缺点(nodejs的概念与特征详解)》 https://www.1pindao.co…...

Linux基础语法进阶版

Linux基础语法 查看文件内容指令 touch 主要是修改文件时间,多用创建文件 -a #只更改访问时间 -m #只更改修改时间 -c --no-create#不创建任何文件cat 展示小文件内容 -b #对于非空输出行编号 -n #对于所有行输出编号 -E #在每行结束处显示"$" -A #展示所…...

近红外染料标记小分子1628790-37-3,Cyanine5.5 alkyne,花青素CY5.5炔基

试剂基团反应特点:Cyanine5.5 alkyne用于点击化学标记的远红外/近红外染料炔烃。氰基5.5是Cy5.5的类似物,一种流行的荧光团,已广泛用于各种应用,包括完整生物体成像。在温和的铜催化化学条件下,该试剂可与叠氮基共轭&a…...

洛谷——P1004 方格取数

【题目描述】 设有 NN 的方格图 (N≤9),我们将其中的某些方格中填入正整数,而其他的方格中则放入数字 0。如下图所示(见样例): A 0 0 0 0 0 0 0 0 0 0 13 0 0 6 0 0 0 0 0 0 7 0 0 0 0 0 0 14 0 0…...

Linux删除软链接

不防大家试试 unlink 命令 首先我们先来创建一个文件 #mkdir test_chk #touch test_chk/test.txt #vim test_chk/test.txt (这一步随便在这个test.txt里写点东东即可) 下面我们来创建test_chk目录 的软链接 #ln-s test_chk test_chk_ln 软链接创建好了,我们来…...

【自然语言处理】【大模型】用于大型Transformer的8-bit矩阵乘法介绍

用于大型Transformer的8-bit矩阵乘法介绍原文地址:A Gentle Introduction to 8-bit Matrix Multiplication for transformers at scale using transformers, accelerate and bitsandbytes 相关博客 【自然语言处理】【大模型】用于大型Transformer的8-bit矩阵乘法介…...

设计模式之工厂模式详解和应用

目录1 工厂模式的历史由来2.简单工厂模式2.1 简单工厂模式定义2.2 简单工厂模式案例2.3 简单工厂模式相关源码2.4 简单工厂模式优缺点3 工厂方法模式3.1 工厂方法模式定义3.2 工厂方法模式案例3.3 工厂方法模式源码3.4 工厂方法模式优缺点4 抽象工厂模式4.1 抽象工厂模式定义4.…...

ArcGIS中的附件功能

从ArcGIS10起,空间数据库增加了"附件"的功能,可灵活管理与要素相关的附加信息,可以是图像、PDF、文本文档或任意其他文件类型。例如,如果用某个要素表示建筑物,则可以使用附件来添加多张从不同角度拍摄的建筑物照片。 启动附件功能 要想使用附件功能,要素类必…...

epoll单台设备支持百万并发连接

一些概念: linux下一切接文件,文件描述符fd,文件I/O(包含socket,文本文件等),I/O多路复用,reactor模型,水平触发,边沿触发,多线程模型,阻塞和非阻塞&#xf…...

网络字节序

文章目录网络字节序网络字节序 内存中的多字节数据相对于内存地址有大端和小端之分, 磁盘文件中的多字节数据相对于文件中的偏移地址也有大端小端之分, 网络数据流同样有大端小端之分. 网络数据流的地址统一按大端处理 发送主机通常将发送缓冲区中的数据按内存地址从低到高的…...

03- SVC 支持向量机做人脸识别 (项目三)

数据集描述: sklearn的lfw_people函数在线下载55个外国人图片文件夹数据集来精确实现人脸识别并提取人脸特征向量数据集地址: sklearn.datasets.fetch_lfw_people — scikit-learn 1.2.1 documentationPCA降维: pca PCA(n_components0.9) 数据拆分: X_train, X_test, y_tra…...

浅谈指向二维数组元素的指针变量

(1)指向数组元素的指针变量 例1.有一个3X4的二维数组,要求用指向元素的指针变量输出二维数组各元素的值. 编写程序 1 #include <stdio.h>2 int main()3 {4 int a[3][4] { 1,3,5,7,9,11,13,15,17,19,21,23 };5 int *p;6 for (p a[0]; p < a[0] 12; p) …...

左右值引用和移动语义

文章首发公众号&#xff1a;iDoitnow 1. 左右值和左右值引用 什么是左值、右值呢&#xff1f;一种极不严谨的理解为&#xff1a;在赋值的时候&#xff0c;能够被放到等号左边的值为左值&#xff0c;放在右边的值为右值。例如&#xff1a; int sum(int x, int y){return x y;…...

一起学习用Verilog在FPGA上实现CNN----(七)全连接层设计

1 全连接层设计 1.1 Layer 进行线性计算的单元layer&#xff0c;原理图如图所示&#xff1a; 1.2 processingElement Layer中的线性计算单元processingElement&#xff0c;原理图如图所示&#xff1a; processingElement模块展开原理图&#xff0c;如图所示&#xff0c;包含…...

tomcat打debug断点调试

windows debug调试 jdk版本&#xff1a;1.8.0_181 tomcat版本&#xff1a;apache-tomcat-9.0.68.0 idea版本&#xff1a;2020.1 方法一 修改catalina.bat 在%CATALINA_HOME%\bin\catalina.bat中找到 set “JAVA_OPTS%JAVA_OPTS% -Djava.protocol.handler.pkgsorg.apache…...

如果持有互斥锁的线程没有解锁退出了,该如何处理?

文章目录如果持有互斥锁的线程没有解锁退出了&#xff0c;该如何处理&#xff1f;问题引入PTHREAD_MUTEX_ROBUST 和 pthread_mutex_consistent登场了结论&#xff1a;如果持有互斥锁的线程没有解锁退出了&#xff0c;该如何处理&#xff1f; 问题引入 看下面一段代码&#xf…...

信息论绪论

本专栏针包含信息论与编码的核心知识&#xff0c;按知识点组织&#xff0c;可作为教学或学习的参考。markdown版本已归档至【Github仓库&#xff1a;information-theory】&#xff0c;需要的朋友们自取。或者关注公众号【AIShareLab】&#xff0c;回复 信息论 也可获取。 文章目…...

Buffer Status Reporting(BSR)

欢迎关注同名微信公众号“modem协议笔记”。 以一个实网中的异常场景开始&#xff0c;大概流程是有UL data要发送&#xff0c;UE触发BSR->no UL grant->SR->no UL grant->trigger RACH->RACH fail->RLF->RRC reestablishment&#xff1a;简单描述就是UE触…...

代码随想录LeetCode | 单调栈问题

前沿&#xff1a;撰写博客的目的是为了再刷时回顾和进一步完善&#xff0c;其次才是以教为学&#xff0c;所以如果有些博客写的较简陋&#xff0c;是为了保持进度不得已而为之&#xff0c;还请大家多多见谅。 预&#xff1a;看到题目后的思路和实现的代码。 见&#xff1a;参考…...

C++之可调用对象、bind绑定器和function包装器

可调用对象在C中&#xff0c;可以像函数一样调用的有&#xff1a;普通函数、类的静态成员函数、仿函数、lambda函数、类的非静态成员函数、可被转换为函数的类的对象&#xff0c;统称可调用对象或函数对象。可调用对象有类型&#xff0c;可以用指针存储它们的地址&#xff0c;可…...

【杂谈】-递归进化:人工智能的自我改进与监管挑战

递归进化&#xff1a;人工智能的自我改进与监管挑战 文章目录 递归进化&#xff1a;人工智能的自我改进与监管挑战1、自我改进型人工智能的崛起2、人工智能如何挑战人类监管&#xff1f;3、确保人工智能受控的策略4、人类在人工智能发展中的角色5、平衡自主性与控制力6、总结与…...

TDengine 快速体验(Docker 镜像方式)

简介 TDengine 可以通过安装包、Docker 镜像 及云服务快速体验 TDengine 的功能&#xff0c;本节首先介绍如何通过 Docker 快速体验 TDengine&#xff0c;然后介绍如何在 Docker 环境下体验 TDengine 的写入和查询功能。如果你不熟悉 Docker&#xff0c;请使用 安装包的方式快…...

云计算——弹性云计算器(ECS)

弹性云服务器&#xff1a;ECS 概述 云计算重构了ICT系统&#xff0c;云计算平台厂商推出使得厂家能够主要关注应用管理而非平台管理的云平台&#xff0c;包含如下主要概念。 ECS&#xff08;Elastic Cloud Server&#xff09;&#xff1a;即弹性云服务器&#xff0c;是云计算…...

Leetcode 3576. Transform Array to All Equal Elements

Leetcode 3576. Transform Array to All Equal Elements 1. 解题思路2. 代码实现 题目链接&#xff1a;3576. Transform Array to All Equal Elements 1. 解题思路 这一题思路上就是分别考察一下是否能将其转化为全1或者全-1数组即可。 至于每一种情况是否可以达到&#xf…...

黑马Mybatis

Mybatis 表现层&#xff1a;页面展示 业务层&#xff1a;逻辑处理 持久层&#xff1a;持久数据化保存 在这里插入图片描述 Mybatis快速入门 ![在这里插入图片描述](https://i-blog.csdnimg.cn/direct/6501c2109c4442118ceb6014725e48e4.png //logback.xml <?xml ver…...

《从零掌握MIPI CSI-2: 协议精解与FPGA摄像头开发实战》-- CSI-2 协议详细解析 (一)

CSI-2 协议详细解析 (一&#xff09; 1. CSI-2层定义&#xff08;CSI-2 Layer Definitions&#xff09; 分层结构 &#xff1a;CSI-2协议分为6层&#xff1a; 物理层&#xff08;PHY Layer&#xff09; &#xff1a; 定义电气特性、时钟机制和传输介质&#xff08;导线&#…...

html-<abbr> 缩写或首字母缩略词

定义与作用 <abbr> 标签用于表示缩写或首字母缩略词&#xff0c;它可以帮助用户更好地理解缩写的含义&#xff0c;尤其是对于那些不熟悉该缩写的用户。 title 属性的内容提供了缩写的详细说明。当用户将鼠标悬停在缩写上时&#xff0c;会显示一个提示框。 示例&#x…...

scikit-learn机器学习

# 同时添加如下代码, 这样每次环境(kernel)启动的时候只要运行下方代码即可: # Also add the following code, # so that every time the environment (kernel) starts, # just run the following code: import sys sys.path.append(/home/aistudio/external-libraries)机…...

【学习笔记】erase 删除顺序迭代器后迭代器失效的解决方案

目录 使用 erase 返回值继续迭代使用索引进行遍历 我们知道类似 vector 的顺序迭代器被删除后&#xff0c;迭代器会失效&#xff0c;因为顺序迭代器在内存中是连续存储的&#xff0c;元素删除后&#xff0c;后续元素会前移。 但一些场景中&#xff0c;我们又需要在执行删除操作…...

【LeetCode】算法详解#6 ---除自身以外数组的乘积

1.题目介绍 给定一个整数数组 nums&#xff0c;返回 数组 answer &#xff0c;其中 answer[i] 等于 nums 中除 nums[i] 之外其余各元素的乘积 。 题目数据 保证 数组 nums之中任意元素的全部前缀元素和后缀的乘积都在 32 位 整数范围内。 请 不要使用除法&#xff0c;且在 O…...