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

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

news 2025/7/5 4:54:36

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

KubeSphere 容器平台高可用：环境搭建与可视化操作指南

Linux_k8s篇 欢迎来到Linux的世界&#xff0c;看笔记好好学多敲多打&#xff0c;每个人都是大神&#xff01; 题目&#xff1a;KubeSphere 容器平台高可用&#xff1a;环境搭建与可视化操作指南 版本号: 1.0,0 作者: 老王要学习 日期: 2025.06.05 适用环境: Ubuntu22 文档说…...

编程新知 2025/7/2 13:08:34

JavaSec-RCE

简介 RCE(Remote Code Execution)&#xff0c;可以分为:命令注入(Command Injection)、代码注入(Code Injection) 代码注入 1.漏洞场景&#xff1a;Groovy代码注入 Groovy是一种基于JVM的动态语言&#xff0c;语法简洁&#xff0c;支持闭包、动态类型和Java互操作性&#xff0c…...

编程新知 2025/6/27 10:08:38

内存分配函数malloc kmalloc vmalloc

内存分配函数malloc kmalloc vmalloc malloc实现步骤： 1）请求大小调整：首先，malloc 需要调整用户请求的大小，以适应内部数据结构（例如，可能需要存储额外的元数据）。通常，这包括对齐调整，确保分配的内存地址满足特定硬件要求（如对齐到8字节或16字节边界）。 2）空闲…...

编程新知 2025/6/18 0:49:30

Unity3D中Gfx.WaitForPresent优化方案

前言 在Unity中&#xff0c;Gfx.WaitForPresent占用CPU过高通常表示主线程在等待GPU完成渲染&#xff08;即CPU被阻塞&#xff09;&#xff0c;这表明存在GPU瓶颈或垂直同步/帧率设置问题。以下是系统的优化方案&#xff1a; 对惹&#xff0c;这里有一个游戏开发交流小组&…...

编程新知 2025/7/2 18:06:11

为什么需要建设工程项目管理？工程项目管理有哪些亮点功能？

在建筑行业&#xff0c;项目管理的重要性不言而喻。随着工程规模的扩大、技术复杂度的提升&#xff0c;传统的管理模式已经难以满足现代工程的需求。过去&#xff0c;许多企业依赖手工记录、口头沟通和分散的信息管理&#xff0c;导致效率低下、成本失控、风险频发。例如&#…...

编程新知 2025/7/4 16:09:41

前端导出带有合并单元格的列表

// 导出async function exportExcel(fileName "共识调整.xlsx") {// 所有数据const exportData await getAllMainData();// 表头内容let fitstTitleList [];const secondTitleList [];allColumns.value.forEach(column > {if (!column.children) {fitstTitleL…...

编程新知 2025/7/4 15:36:44

Auto-Coder使用GPT-4o完成：在用TabPFN这个模型构建一个预测未来3天涨跌的分类任务

通过akshare库&#xff0c;获取股票数据&#xff0c;并生成TabPFN这个模型 可以识别、处理的格式&#xff0c;写一个完整的预处理示例&#xff0c;并构建一个预测未来 3 天股价涨跌的分类任务 用TabPFN这个模型构建一个预测未来 3 天股价涨跌的分类任务&#xff0c;进行预测并输…...

编程新知 2025/6/26 20:21:28

多模态商品数据接口：融合图像、语音与文字的下一代商品详情体验

一、多模态商品数据接口的技术架构 &#xff08;一&#xff09;多模态数据融合引擎 跨模态语义对齐 通过Transformer架构实现图像、语音、文字的语义关联。例如&#xff0c;当用户上传一张“蓝色连衣裙”的图片时&#xff0c;接口可自动提取图像中的颜色&#xff08;RGB值&…...

编程新知 2025/7/4 19:13:43

【论文阅读28】-CNN-BiLSTM-Attention-（2024）

本文把滑坡位移序列拆开、筛优质因子&#xff0c;再用 CNN-BiLSTM-Attention 来动态预测每个子序列&#xff0c;最后重构出总位移&#xff0c;预测效果超越传统模型。 文章目录 1 引言2 方法2.1 位移时间序列加性模型2.2 变分模态分解 (VMD) 具体步骤2.3.1 样本熵&#xff08;S…...

编程新知 2025/7/4 10:53:23

tree 树组件大数据卡顿问题优化

问题背景 项目中有用到树组件用来做文件目录&#xff0c;但是由于这个树组件的节点越来越多&#xff0c;导致页面在滚动这个树组件的时候浏览器就很容易卡死。这种问题基本上都是因为dom节点太多&#xff0c;导致的浏览器卡顿&#xff0c;这里很明显就需要用到虚拟列表的技术&…...

编程新知 2025/7/5 1:10:52