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

前端框架Vue2.0+Vue3.0学习笔记01

news 2026/3/29 1:04:06

一、Vue技术_课程简介

1、前端框架小白

2、熟练掌握Vue2

3、轻松玩转Vue3

①、vue基础

②、vue-cli

③、vue-router

④、vuex

⑤、element-ui

⑥、vue3

二、Vue技术_Vue简介

1、Vue是什么？

一套用于构建用户界面（把你拿到手里的数据，通过某种办法变成用户可以看见的界面）的渐进式（Vue可以自底向上逐层的应用：①、简单应用:只需一个轻量小巧的核心库 ②、复杂应用：可以引入各式各样的Vue插件。逐渐递进：从一个轻量小巧的核心库逐渐递进到使用各式各样的Vue插件）JavaScript框架

2、谁开发的？

尤雨溪

3、Vue的特点

①、采用组件化模式，提高代码复用率、且让代码更好维护。

②、声明式编码，让编码人员无需直接操作DOM，提高开发效率。

③、使用虚拟DOM+优秀的Diff算法，尽量复用DOM节点

4、学习Vue之前要掌握的JavaScript基础知识

ES6语法规范：解构赋值、模板字符串、箭头函数

ES6模块化：默认暴露、分别暴露、统一暴露 import export

包管理器：npm、yarn、cnpm

原型、原型链：

数组常用方法：过滤一个数组、加工一个数组、筛选最值

axios：

promise：

......

三、Vue技术_Vue官网使用指南

https://cn.vuejs.org/

四、Vue技术_搭建Vue开发环境

引入vue.js文件

五、Vue技术_Hello小案例

六、Vue技术_分析Hello案例

<!DOCTYPE html>
<html><head><meta charset="UTF-8" /><title>初始Vue</title><!-- 引入Vue（可以说是对象也可以说是函数）如果你引入了Vue，全局就多了Vue这个构造函数 --><script type="text/javascript" src="../js/vue.js"></script></head><body><!--初识Vue:1、想让Vue工作，就必须创建一个Vue实例，且要传入一个配置对象；2、root容器里的代码依然符合html规范，只不过混入了一些特殊的Vue语法；3、root容器里的代码被称为【Vue模板】4、Vue实例和容器是一一对应的；5、真实开发中具有一个Vue实例，并且会配合着组件一起使用；6、{{xxx}}中的xxx要写js表达式，且xxx可以自动读取到data中的所有属性；7、一旦data中的数据发生改变，那么模板中用到该数据的地方也会自动更新；--><!-- 准备好一个容器 --><div id="root"><h1>Hello, {{name.toUpperCase()}}, {{address}}</h1></div><script type="text/javascript">Vue.config.productionTip = false //阻止 Vue 在启动时生成生产提示//创建Vue实例const x = new Vue({el:'#root',//el用于指定当前Vue实例为哪个容器服务，值通常为css选择器字符串data:{ //data中用于存储数据，数据供el所指定的容器去使用。值我们暂时先写成一个对象。name:'nanjing',address:'北京'}})</script></body>
</html>

相关文章：

前端框架Vue2.0+Vue3.0学习笔记01

一、Vue技术_课程简介 1、前端框架小白 2、熟练掌握Vue2 3、轻松玩转Vue3 ①、vue基础 ②、vue-cli ③、vue-router ④、vuex ⑤、element-ui ⑥、vue3 二、Vue技术_Vue简介 1、Vue是什么&#xff1f; 一套用于构建用户界面&#xff08;把你拿到手里的数据&#xf…...

编程日记 2023/10/9 10:12:34

iOS App上架全流程及相关处理

iOS app上架总体流程&#xff1a; 一、IOS上架整个流程 1、申请开发者账号 2、创建APP ID及申请证书 3、itunes connect 创建APP 4、打包 上传APP 5、提交APP&#xff0c;上线成功 1、申请开发者账号 苹果开发者账号主要分为三种&#xff1a;个人账号、公司账号、企业账…...

编程日记 2023/10/9 10:11:34

解决WordPress升级后提示：无需升级，您的WordPress数据库已经是最新的了

问题描述 当升级了 WordPress 6.3 后&#xff0c;登录后台出现了提示&#xff1a;无需升级&#xff0c;您的WordPress 数据库已经是最新的了。并且无法进入后台了。 出现这个问题的原因可能是你网站开启了 Memcached 缓存。 如何验证是否开启了 Memcached 缓存&#xff1f;检…...

编程日记 2023/10/9 10:10:32

springcloud之项目实战搭建单体

写在前面 在上篇文章 中我们介绍了项目的整体内容以及架构&#xff0c;本文就开始实现一个单体的版本&#xff0c;在之后的文章中&#xff0c;在使用springcloud相关组件将这个单体的版本一步步的拆分为微服务的版本&#xff0c;在开始之前再贴下组件图&#xff1a; 本文我们分…...

编程日记 2023/10/9 10:07:27

Mac 点击桌面 出现黑边框 解决

1、桌面黑框效果 2、解决&#xff1a;设置为 仅在台前调度中...

编程日记 2023/10/9 10:06:26

深度学习（2）---循环神经网络(RNN)

文章目录 一、序列数据和语言模型1.1 序列数据1.2 语言模型 二、循环神经网络(RNN)2.1 概述2.2 门控循环单元(GRU)2.3 长短期记忆网络(LSTM) 一、序列数据和语言模型 1.1 序列数据 1. 在深度学习中&#xff0c;序列数据&#xff08;Sequence data&#xff09;是指具有前后顺序…...

编程日记 2023/10/9 10:05:24

[NOIP2010 提高组] 机器翻译

[NOIP2010 提高组] 机器翻译 题目背景 小晨的电脑上安装了一个机器翻译软件&#xff0c;他经常用这个软件来翻译英语文章。 题目描述 这个翻译软件的原理很简单&#xff0c;它只是从头到尾&#xff0c;依次将每个英文单词用对应的中文含义来替换。对于每个英文单词&#xf…...

编程日记 2023/10/9 10:04:21

配置文件生成器-秒杀SSM的xml整合

配置文件生成器-秒杀SSM的xml整合 思路&#xff1a; 通过简单的配置&#xff0c;直接生成对应配置文件。 maven坐标 <dependencies><!-- 配置文件生成 --><dependency><groupId>org.freemarker</groupId><artifactId>freemarker<…...

编程日记 2023/10/9 10:00:16

小黑开始了拉歌训练，第一次进入部室馆，被通知要去当主持人心里有些紧张的leetcode之旅:337. 打家劫舍 III

小黑代码&#xff08;小黑卡在了bug中&#xff0c;上午一步步探索做出&#xff0c;非常NB!!!&#xff09; # Definition for a binary tree node. # class TreeNode: # def __init__(self, val0, leftNone, rightNone): # self.val val # self.left lef…...

编程日记 2023/10/9 9:59:15

flutter开发实战-inappwebview实现flutter与Javascript方法调用

flutter开发实战-inappwebview实现flutter与Javascript方法调用 在使用inappwebview时候&#xff0c;需要flutter端与JS进行交互&#xff0c;调用相应的方法&#xff0c;在inappwebview中的JavaScript Handlers。 一、JavaScript Handlers 要添加JavaScript Handlers&#…...

编程日记 2023/10/9 9:58:14

alsa pcm设备之硬件参数

硬件参数包含了stream描述比如格式,采样率,通道数,和ringbuffer 圆形缓存区大小等. 使用snd_pcm_hw_params_t ,ALSA pcm设备使用了参数重定义系统相关的硬件参数,应用程序首先选择全范围的配置, 然后应用程序设置单个参数,直到所有参数都是基本的(确定的). 格式 量化位數&#…...

编程日记 2023/10/9 9:57:12

websocket拦截

python实现websocket拦截 前言一、拦截的优缺点优点缺点二、实现方法1.环境配置2.代码三、总结现在的直播间都是走的websocket通信，想要获取websocket通信的内容就需要使用websocket拦截，大多数是使用中间人代理进行拦截，这里将会使用更简单的方式进行拦截。 前言 开发者工…...

编程日记 2023/10/9 9:56:08

深度强化学习之 PPO 算法

深度强化学习之 PPO 算法 强化学习原理学习策略 基于行为价值 & 基于行为概率策略梯度算法&#xff1a;计算状态下所有行为的概率演员 - 评论家算法&#xff1a;一半基于行为价值&#xff0c;一半基于行为概率DQN 算法&#xff08;深度Q网络&#xff09;Q-Learning&#x…...

编程日记 2023/10/9 9:55:08

iPhone升级iOS17出现无法连接互联网的错误提示怎么办？

最新的iOS 17系统已经发布了快一个月了&#xff0c;很多人都已升级体验更多全新功能&#xff0c;但有部分用户却在升级过程中遇到一些问题&#xff1a;如无法验证更新&#xff0c;iOS17验证失败&#xff0c;因为您不再连接到互联网、 iPhone无法检查更新等错误问题。明明网络稳…...

编程日记 2023/10/9 9:54:06

Spring:处理@Autowired和@Value注解的BeanPostProcessor

AutowiredAnnotationBeanPostProcessor,它实现了MergedBeanDefinitionPostProcessor,因此会调用postProcessMergedBeanDefinition方法。 它实现了InstantiationAwareBeanPostProcessor,因此在属性注入时会调用postProcessPropertyValues方法 如果Autowired注解按类型找到了大…...

编程日记 2023/10/9 9:53:05

极坐标系下的交换积分次序

极坐标系下的交换积分次序 我把极坐标系下的交换积分次序总结为动静与静动之间的转换&#xff0c;下面通过一个例子感受一下 ρ 1 、 ρ 1 cos ⁡ θ \rho1、\rho1\cos\theta ρ1、ρ1cosθ ∫ 0 π / 2 d θ ∫ 1 1 cos ⁡ θ f ( ρ cos ⁡ θ , ρ sin ⁡ θ ) ρ d…...

编程日记 2023/10/9 9:52:04

MySQL命令行中文乱码问题

MySQL命令行中文乱码问题&#xff1a; 命令行界面默认字符集是gbk&#xff0c;若字符集不匹配会中文乱码或无法插入中文。 解决办法&#xff1a;执行set names gbk; 验证&#xff1a; 执行命令show variables like ‘char%’;查看默认字符集。 创建数据库设置字符集utf8&…...

编程日记 2023/10/9 9:51:03

图论---图的遍历

在图论中&#xff0c;图的遍历一般有两种&#xff0c;分别为DFS&#xff08;深度优先遍历&#xff09;、BFS&#xff08;广度优先遍历&#xff09;&#xff0c;以下是这两种遍历方式的模板&#xff1a; DFS&#xff08;深度优先搜索&#xff09; 代码框架&#xff1a; void …...

编程日记 2023/10/9 9:50:00

AM@无穷小和无穷大

文章目录 abstract本文符号说明无穷小无穷小和自变量变化过程无穷小和函数极限的关系定理&#x1f47a;证明 无穷大无穷大不是数极限无穷大的说法证明函数极限为无穷大 无穷大和无穷小见的关系定理无穷小无穷大的运算法则 abstract 无穷小和无穷大的概念和相关性质 本文符号说…...

编程日记 2023/10/9 9:48:59

玄子Share- IDEA 2023 SpringBoot 热部署

玄子Share- IDEA 2023 SpringBoot 热部署 修改 IDEA 部署设置 IDEA 勾选如下选项 新建 SpringBoot 项目 项目构建慢的将 Spring Initializr 服务器 URL 改为阿里云&#xff1a;https://start.aliyun.com/ 在这里直接勾选Spring Boot Devtools插件即可 测试 切出 IDEA 项目文…...

编程日记 2023/10/9 9:47:58

教育工作者必备：用清音刻墨Qwen3为教学视频自动生成时间轴字幕

教育工作者必备&#xff1a;用清音刻墨Qwen3为教学视频自动生成时间轴字幕 1. 引言&#xff1a;教学视频的字幕痛点 作为一名教育工作者&#xff0c;您是否经常遇到这样的困扰&#xff1f;录制完教学视频后&#xff0c;手动添加字幕耗费大量时间&#xff0c;而且很难做到音画…...

编程新知 2026/3/28 23:52:57

Matlab实战：5种方法可视化MIMO/SISO信道容量差异（附完整代码）

Matlab实战&#xff1a;5种方法可视化MIMO/SISO信道容量差异&#xff08;附完整代码&#xff09; 无线通信系统的性能评估离不开对信道容量的深入理解。对于刚接触多天线系统的学习者来说&#xff0c;如何直观比较不同天线配置下的性能差异是一个常见痛点。本文将用Matlab带你探…...

编程新知 2026/3/28 23:48:56

BFG Repo Cleaner终极指南：10倍速清理Git仓库的完整方案

BFG Repo Cleaner终极指南&#xff1a;10倍速清理Git仓库的完整方案 【免费下载链接】bfg-repo-cleaner Removes large or troublesome blobs like git-filter-branch does, but faster. And written in Scala 项目地址: https://gitcode.com/gh_mirrors/bf/bfg-repo-cleaner…...

编程新知 2026/3/28 22:12:03

Minitab单因子方差分析实战：从数据导入到结果解读全流程（附油漆硬度案例）

Minitab单因子方差分析实战&#xff1a;从数据导入到结果解读全流程&#xff08;附油漆硬度案例&#xff09; 在工业质量控制和科研实验中&#xff0c;我们常常需要比较不同组别间的均值差异是否具有统计学意义。单因子方差分析&#xff08;One-Way ANOVA&#xff09;正是解决这…...

编程新知 2026/3/28 19:28:55

如何用LLVIP数据集提升夜间行人检测？YOLOv5实战教程（附避坑指南）

夜间行人检测实战&#xff1a;用LLVIP数据集优化YOLOv5模型的完整指南 当路灯成为城市夜晚唯一的光源&#xff0c;传统监控摄像头的视野开始变得模糊不清——这正是计算机视觉工程师在安防领域最常遇到的挑战之一。LLVIP数据集的出现为这一困境提供了突破性的解决方案&#xf…...

编程新知 2026/3/28 19:08:50

基于本机配置的 YOLO26 Conda ss‘安装教程：Windows 11 + RTX 3050 Ti 实战版

基于本机配置的 YOLO26 Conda 环境安装教程&#xff1a;Windows 11 RTX 3050 Ti 实战版 这篇文章不是泛泛而谈的“通用装环境教程”&#xff0c;而是按你这台电脑当前的实际配置整理出来的一份可直接照做的安装方案。 如果你以前没有配过深度学习环境&#xff0c;只想先把 co…...

编程新知 2026/3/28 18:26:22

IC版图工程师的日常：用Magic/Cadence画版图时，那些图层到底对应FAB里的哪一步？

IC版图工程师的日常&#xff1a;揭秘Magic/Cadence图层与FAB工艺的映射关系 作为一名IC版图工程师&#xff0c;每天面对Magic或Cadence工具中那些五颜六色的图层时&#xff0c;你是否曾好奇过&#xff1a;这些抽象的几何图形最终如何在硅片上变成真实的晶体管结构&#xff1f;A…...

编程新知 2026/3/28 18:04:15

路径遍历 PortSwigger labs

File path traversal, simple case 实验信息 平台&#xff1a;PortSwigger Web Security Academy 漏洞&#xff1a;路径遍历漏洞&#xff08;Path Traversal&#xff09; Lab:Server-side vulnerabilities - PortSwigger 难度&#xff1a;简单 漏洞原理 网站通过 filena…...

编程新知 2026/3/28 17:56:14

为什么你的视觉检测准确率卡在92.7%？（揭秘工业现场3类未标注异常数据导致的模型过拟合代码根源）

第一章&#xff1a;视觉检测准确率瓶颈的工业现场真相在实际产线部署中&#xff0c;视觉检测模型在实验室达到99.2%的mAP&#xff0c;落地后却频繁出现漏检与误报——这不是算法缺陷&#xff0c;而是工业现场多维干扰叠加的真实映射。光照波动、工件表面反光、传送带抖动、镜头…...

编程新知 2026/3/28 17:35:56

剪映视频去水印+去字幕+去logo三合一操作流程（新手必备）

在短视频创作热潮中&#xff0c;剪映凭借免费、易用的优势&#xff0c;成为多数创作者的首选剪辑工具。但在实际使用中&#xff0c;不少人会遇到一个共性问题&#xff1a;剪映导出的视频自带水印、素材中夹杂多余字幕&#xff0c;或搬运、引用的素材带有品牌Logo&#xff0c;尤…...

编程新知 2026/3/28 16:43:31