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

vue的由来、vue教程和M-V-VM架构思想、vue的使用、nodejs

news 2026/5/13 16:10:26

vue

vue的由来
vue教程和M-V-VM架构思想
vue的初步简单使用
nodejs

vue的由来

# 1 HTML(5)、CSS(3)、JavaScript(ES5、ES6、ES11)：编写一个个的页面 -> 给后端(PHP、Python、Go、Java) -> 后端嵌入模板语法 -> 后端渲染完数据 -> 返回数据给前端 -> 在浏览器中查看# 2 Ajax的出现 -> 后台发送异步请求，Render+Ajax混合# 3 单用Ajax（加载数据，DOM渲染页面）：前后端分离的雏形前端就用html，css，js 写页面，空页面当页面加载完成---》发送ajax---》后端获取数据js 把获取完的数据，渲染到页面上后端只负责写接口# 4 Angular框架的出现（1个JS框架）：出现了“前端工程化”的概念（前端也是1个工程、1个项目）# 5 React、Vue框架：当下最火的2个前端框架（Vue：国人喜欢用，React：外国人喜欢用）# 6 移动开发（Android+IOS） + Web（Web+微信小程序+支付宝小程序） + 桌面开发（Windows桌面）：前端 -> 大前端# 7 一套代码在各个平台运行（大前端）：谷歌Flutter（Dart语言：和Java很像）可以运行在IOS、Android、PC端# 8 在Vue框架的基础性上 uni-app：一套编码 编到10个平台# 9 在不久的将来 ，前端框架可能会一统天下

vue教程和M-V-VM架构思想

# 官网：教程https://cn.vuejs.org/# vue版本-vue3 ：一般情况下，新项目都用vue3编写-vue2 ：公司里很多项目用vue2编写的-就在vue3上写vue2的语法，完全支持，但是vue3的语法不一样了# 基础阶段讲vue2,1--2天vue3vue2：https://v2.cn.vuejs.org/v2/guide/vue3：https://cn.vuejs.org/guide/quick-start.html# vue 是什么
Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架渐进式：前端项目中可以一部分使用vue，也可以全部项目使用vue# M-V-VM架构思想# 之前学过mvc，mtvMVVM 是Model-View-ViewModel 的缩写，它是一种基于前端开发的架构模式，是一种事件驱动编程方式
Model ：js中的变量
View ： 用户看到的页面
ViewModel：只要js中变量变化了，页面自动跟着变化 ，页面中数据变化了，js变量也跟着变# 单页面应用(组件化开发)-single page application，SPA-原来写一个个html页面-用了vue后，只有一个html页面

vue的使用

# vue 项目，选择编辑器-vscode：免费-webstorm：jetbrains全家桶公司出品：pycharm，idea，goland...-收费的，破解方案跟pycharm一样-单个  全家桶-本质跟pycharm是一个东西，我们就不下载webstorm了，直接在pycharm中配置一下，安装一个插件，就支持写vue了-----------------------------------------------------------------------注意：
'''
官网：https://cdn.jsdelivr.net/npm/vue/dist/vue.js
打开后将里面的内容拷贝出来，建一个文件夹，然后建一个js文件放入
'''<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><!--  <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> --><script src="./js/vue.js"></script></head>
<body>
<div id="app"><h1>这里面可以写vue的模板语法</h1><!--插值语法--><p>姓名是：{{name}}</p><p>年龄是：{{age}}</p>
</div></body><script>// div  被 vue托管了---》内部就可以写vue的语法，vue会自动渲染// 本质是dom操作，只是不用我们手动操作了var vm = new Vue({el: '#app',data: {name: 'lin',age: 19}})console.log(vm.$data.name)// pereson=Person(data={name:lqz,age:19})// __inti__// self.data=data//self.name=data.get('name')// person.name
</script>
</html>

在这里插入图片描述

nodejs

解释型的语言是需要解释器的
js就是一门解释型语言，只不过js解释器被集成到了浏览器中所以，在浏览器的Console中输入命令，就和在cmd中输入python后，进入交互式环境一样nodejs：一门后端语言,运行在操作系统上的语言---》网络处理，文件处理
把chrome的v8引擎（解释器），安装到操作系统之上vue 项目编译成 纯粹的html，css，js---》需要有node环境

相关文章：

vue的由来、vue教程和M-V-VM架构思想、vue的使用、nodejs

vue vue的由来 vue教程和M-V-VM架构思想 vue的初步简单使用 nodejs vue的由来 # 1 HTML(5)、CSS(3)、JavaScript(ES5、ES6、ES11)&#xff1a;编写一个个的页面 -> 给后端(PHP、Python、Go、Java) -> 后端嵌入模板语法 -> 后端渲染完数据 -> 返回数据给前端 ->…...

编程日记 2023/9/21 4:20:20

课程表 循环依赖 拓扑排序 go语言

学会拓扑排序题目的基本解法 res数组 记录上课顺序g 记录学了课程i 能解锁的课程jindeg 记录每个课程的入度q 记录入度为0的课程 for循环q去解放其他课程 本题来自力扣课程表 func findOrder(numCourses int, prerequisites [][]int) []int {res : []int{}//建一个二维数组记…...

编程日记 2023/9/21 4:18:18

【红包雨接口设计】

一、服务器地址 http://rb.atguigu.cn 二、公共请求头参数 参数名称类型是否必选描述tokenString是用户唯一标识 备注&#xff1a;为了方便我们今天演示&#xff0c;服务端接受所有token。 三、接口 1. 创建红包雨 请求方式&#xff1a;GET请求地址&#xff1a;/api/v1/se…...

编程日记 2023/9/21 4:17:17

SSL证书到期更换证书会影响排名吗？

在现代的数字化时代&#xff0c;网络安全和用户体验成为了网站运营商和开发者们需要高度关注的问题。SSL证书作为一种重要的安全协议&#xff0c;对网站的安全性和用户信任起着至关重要的作用。然而&#xff0c;随着SSL证书的有效期限届满&#xff0c;许多网站运营商面临着更换…...

编程日记 2023/9/21 4:13:13

前端常用库之-JavaScript工具库lodash

文章目录 前端常用库之-JavaScript工具库lodash一、什么是lodash二、安装三、lodash使用Lodash 的 pick() 函数介绍和使用react 实例demo&#xff1a;pick结合...展开运算符(spread operator) 前端常用库之-JavaScript工具库lodash 一、什么是lodash 官网&#xff1a; https:…...

编程日记 2023/9/21 4:12:12

Linux- execve()

execve() 是 Linux/UNIX 中的 exec 函数家族中的一个&#xff0c;它允许进程执行一个新的程序。具体地&#xff0c;execve() 替换当前进程的映像为新的程序映像。 函数原型如下&#xff1a; int execve(const char *pathname, char *const argv[], char *const envp[]);pathn…...

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

007 数据结构_堆——“C”

前言 本文将会向您介绍关于堆Heap的实现 具体步骤 tips&#xff1a;本文具体步骤的顺序并不是源代码的顺序 typedef int HPDataType; typedef struct Heap {HPDataType* _a;int _size;int _capacity; }Heap;初始化 void HeapCreate(Heap* hp, HPDataType* a, int n) {hp-&…...

编程日记 2023/9/21 4:09:09

zabbix的原理与安装

一、Zabbix介绍 1、zabbix 是什么&#xff1f; zabbix是一个开源的IT基础监控软件&#xff0c;能实时监控网络服务&#xff0c;服务器和网络设备的状态&#xff0c;如网络使用&#xff0c;CPU负载、磁盘空间等&#xff0c;主要是包括数据的收集、报警和通知的可视化界面zabbi…...

编程日记 2023/9/21 4:07:08

ReactNative中升级IOS 17版本Crash解决

ReactNative中升级IOS 17版本Crash解决 ReactNative中升级IOS 17版本Crash解决一、问题描述二、原因分析三、解决方案决策3.1 设置宽高为非零值3.2 使用新的UIGraphicsImageRenderer替换就版本的UIGraphicsBeginImageContext 四、可能使用到该API的三方库4.1 react-native-fast…...

编程日记 2023/9/21 4:06:07

MongoDB详解

一、MongoDB概述 MongoDB 是一个基于 分布式文件存储 的开源 NoSQL 数据库系统&#xff0c;由 C 编写的。MongoDB 提供了 面向文档 的存储方式&#xff0c;操作起来比较简单和容易&#xff0c;支持“无模式”的数据建模&#xff0c;可以存储比较复杂的数据类型&#xff0c;是一…...

编程日记 2023/9/21 4:04:05

【SpringCloud微服务全家桶学习笔记-服务注册zookeeper/consul】

SpringCloud微服务全家桶学习笔记 Eureka服务注册 gitee码云仓库 9.其他服务注册框架 &#xff08;1&#xff09;zookeeper安装与使用 zookeeper需安装在虚拟机上&#xff0c;建议使用CentOS&#xff0c;安装地址如下&#xff1a; zookeeper镜像源 选择第一个进入后下载ta…...

编程日记 2023/9/21 4:00:59

【滑动窗口】LCR 016. 无重复字符的最长子串

LCR 016. 无重复字符的最长子串 解题思路 窗口内的字符串就是不重复子串每次遇到新的字符 看看窗口内是否存在该字符 如果存在直接剔除 然后调整窗口左边界不存在 添加窗口内部 右边界 class Solution {public int lengthOfLongestSubstring(String s) {if(s.length() < …...

编程日记 2023/9/21 3:58:58

C++中将类成员函数作为变量传递给函数

假设类ClassName有一个成员函数 void ClassName::funcname(int);通过typedef定义一个类成员函数指针类型，参数和返回值类型都要与成员函数对应 typedef void (ClassName::*FuncPtr)(int); // 定义类成员函数指针获取到的参数就是 FuncPtr pf...

编程日记 2023/9/21 3:57:57

2024届数字IC设计秋招面经-鼎信

背景 985硕士&#xff0c;计算机科班&#xff0c;实验室做cpu设计和fpga算法加速&#xff0c;我做处理器安全方向&#xff0c;有项目。 投递 8.25 没有笔试&#xff0c;两轮面试&#xff0c;直接通知下周一面试&#xff0c;草草的准备了下。 一面 技术面 9.4 不到半小时 …...

编程日记 2023/9/21 3:56:55

【数据结构】二叉树的节点数，叶子数，第K层节点数，高度，查找x节点，判断是否为完全二叉树等方法

&#x1f490; &#x1f338; &#x1f337; &#x1f340; &#x1f339; &#x1f33b; &#x1f33a; &#x1f341; &#x1f343; &#x1f342; &#x1f33f; &#x1f344;&#x1f35d; &#x1f35b; &#x1f364; &#x1f4c3;个人主页 &#xff1a;阿然成长日记 …...

编程日记 2023/9/21 3:55:54

前馈神经网络（FFNN）和多层感知机（MLP）

多层感知器&#xff08;MLP, Multi-Layer Perceptron&#xff09;和前馈神经网络&#xff08;Feed-Forward Neural Network, FFNN&#xff09;是深度学习中两个经常被使用的术语&#xff0c;它们经常被互换使用。让我们详细地了解这两个术语&#xff1a; 多层感知器 (MLP): M…...

编程日记 2023/9/21 3:53:53

EasySwipeMenuLayout - 独立的侧滑删除

官网 GitHub - anzaizai/EasySwipeMenuLayout: A sliding menu library not just for recyclerview, but all views. 项目介绍 A sliding menu library not just for recyclerview, but all views. Recommended in conjunction with BaseRecyclerViewAdapterHelper Feature…...

编程日记 2023/9/21 3:50:50

优麒麟下载、安装、体验

下载 官网 优麒麟 点击增强版、或者基础版进行下载 虚拟机安装 选择镜像 修改名称和存储路径 设置为50G 下一步&#xff0c;点击完成 开启安装 设置语言 去掉下载更新选项 继续 点击restart now 输入密码 出现下图说明安装成功&#xff0c;可以畅快的使用了...

编程日记 2023/9/21 3:49:49

Appium混合页面点击方法tap的使用

原生应用开发&#xff0c;是在Android、IOS等移动平台上利用官方提供的开发语言、开发类库、开发工具进行App开发&#xff1b;HTML5&#xff08;h5&#xff09;应用开发&#xff0c;是利用Web技术进行的App开发。目前&#xff0c;市面上很多app都是原生和h5混合开发&#xff0c…...

编程日记 2023/9/21 3:48:48

求解灰度直方图，如何绘制灰度直方图（数字图像处理大题复习 P1）

文章目录 1. 画 X 轴2. 画直方图3. Complete 视频原链接 数字图像处理期末考试大题 B站链接 1. 画 X 轴 2. 画直方图 有几个 0 就在图上画多高&#xff0c;同理有几个 1 &#xff0c;X1 的地方就画多高 3. Complete 这里的情况比较平均&#xff0c;一般来说不会这么平均&a…...

编程日记 2023/9/21 3:47:47

LangGraph 生产级部署全解：FastAPI + Docker

一、部署架构总览 我们将基于你之前的带人工干预的双智能体系统&#xff0c;构建一个完整的生产级部署方案&#xff0c;包含三个核心部分&#xff1a; FastAPI 接口层&#xff1a;封装 Agent 为标准 HTTP 接口&#xff0c;支持任务启动、人工干预、状态查询Redis 持久化层&am…...

编程新知 2026/5/13 12:15:39

终端里的编程副驾：DeepSeek-TUI-项目深度拆解，实测与原理分析

刷 GitHub Trending 又看到一个挺有意思的东西&#xff1a;DeepSeek-TUI。说白了&#xff0c;就是把 DeepSeek V4 这个编程大模型&#xff0c;直接塞进了你的终端里。 这玩意儿不是简单的 CLI 包装。我跑了一下 curl 看 README&#xff0c;发现他们搞了个完整的 TUI&#xff08…...

编程新知 2026/5/13 8:17:10

3分钟学会！用Video-subtitle-extractor轻松提取视频硬字幕，告别手动转录烦恼

3分钟学会&#xff01;用Video-subtitle-extractor轻松提取视频硬字幕&#xff0c;告别手动转录烦恼 【免费下载链接】video-subtitle-extractor 视频硬字幕提取&#xff0c;生成srt文件。无需申请第三方API&#xff0c;本地实现文本识别。基于深度学习的视频字幕提取框架&…...

编程新知 2026/5/13 7:56:54

小米Agent岗二面：你们 RAG 知识库上线之后，文档更新了怎么办？

&#x1f454;面试官&#xff1a;你们 RAG 知识库上线之后&#xff0c;文档更新了怎么办&#xff1f;总不能每次改个文档就把整个知识库重建一遍吧。 &#x1f64b;‍♂️我&#xff1a;可以直接找到变了的那个 chunk&#xff0c;更新它的向量就行了。 &#x1f454;面试官&a…...

编程新知 2026/5/13 7:05:01

别再傻傻传文件了！用Java Base64把图片和PDF直接“塞”进HTML页面（附完整代码）

告别文件传输&#xff1a;Java Base64技术实现图片与PDF的HTML直嵌方案 在Web开发中&#xff0c;我们经常遇到需要将图片或PDF文档直接嵌入HTML页面的场景。传统做法通常需要先将文件上传到服务器&#xff0c;然后通过URL引用&#xff0c;这不仅增加了网络请求&#xff0c;还引…...

编程新知 2026/5/13 5:57:55

CAPL脚本中数据类型转换的实战解析：ASCII数组与字符串的精准互转

1. 为什么需要ASCII数组与字符串互转 在汽车电子测试领域&#xff0c;我们经常需要处理各种数据格式的转换。比如ECU返回的报文可能是以ASCII数组形式呈现的&#xff0c;而我们需要将其转换为可读的字符串进行分析&#xff1b;反过来&#xff0c;当我们需要发送特定指令时&…...

编程新知 2026/5/13 5:21:13

Windows平台APK部署技术探索：轻量级安卓应用安装实践指南

Windows平台APK部署技术探索&#xff1a;轻量级安卓应用安装实践指南 【免费下载链接】APK-Installer An Android Application Installer for Windows 项目地址: https://gitcode.com/GitHub_Trending/ap/APK-Installer 在跨平台应用开发与部署日益普及的今天&#xff0…...

编程新知 2026/5/13 5:14:40

WarcraftHelper：让经典魔兽在现代电脑上重获新生

WarcraftHelper&#xff1a;让经典魔兽在现代电脑上重获新生 【免费下载链接】WarcraftHelper Warcraft III Helper , support 1.20e, 1.24e, 1.26a, 1.27a, 1.27b 项目地址: https://gitcode.com/gh_mirrors/wa/WarcraftHelper 你是否还记得那些在网吧通宵对战《魔兽争…...

编程新知 2026/5/13 4:10:09

OptiSearch：浏览器扩展实现AI与搜索引擎的无缝集成

1. 项目概述&#xff1a;当搜索遇到AI&#xff0c;一次查询&#xff0c;双重答案作为一名长期在信息检索和效率工具领域折腾的开发者&#xff0c;我一直在思考一个问题&#xff1a;我们每天在搜索引擎和AI聊天机器人之间要切换多少次标签页&#xff1f;搜索一个技术问题&#x…...

编程新知 2026/5/13 3:57:35

终极飞书文档迁移方案：25分钟批量导出700+文档的完整指南

终极飞书文档迁移方案&#xff1a;25分钟批量导出700文档的完整指南 【免费下载链接】feishu-doc-export 飞书文档导出服务 项目地址: https://gitcode.com/gh_mirrors/fe/feishu-doc-export 你是否曾因公司办公软件切换或数据备份而面临飞书文档迁移的困境&#xff1f;…...

编程新知 2026/5/13 2:57:25