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

vue

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

vue的由来

# 1 HTML(5)CSS(3)、JavaScript(ES5ES6ES11):编写一个个的页面 -> 给后端(PHP、Python、Go、Java) -> 后端嵌入模板语法 -> 后端渲染完数据 -> 返回数据给前端 -> 在浏览器中查看# 2 Ajax的出现 -> 后台发送异步请求,Render+Ajax混合# 3 单用Ajax(加载数据,DOM渲染页面):前后端分离的雏形前端就用html,css,js 写页面,空页面当页面加载完成---》发送ajax---》后端获取数据js 把获取完的数据,渲染到页面上后端只负责写接口# 4 Angular框架的出现(1JS框架):出现了“前端工程化”的概念(前端也是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环境

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

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

相关文章

国泰君安基本操作学习

对于主面板 1.放大或者缩小k线方法&#xff1a;按着ctrl键滚轮 2.切到历史k线&#xff1a;不断缩小k线后&#xff0c;把鼠标放置k线位置再按着ctrl滚轮放到可以切到当时的历史数据。 ★3.上下切换股票&#xff1a;滚轮。 ★4.面板直接输入股票代码后&#xff0c;自动弹出窗…

驱动开发练习,platform驱动模型的使用

一.总线模型介绍 linux中将一个挂载在总线上的驱动的驱动模型分为三部分&#xff1a;device、driver和bus&#xff1b; device部分&#xff1a;用来保存设备信息对象&#xff0c;在内核中一个klist_device链表中进行管理&#xff1b; driver部分&#xff1a;用来保存驱动信息对…

“毛细血管”的进化:华为分销业务如何让伙伴也有“高能级”

作者 | 曾响铃 文 | 响铃说 数字化蓬勃发展的大时代&#xff0c;除了那些中、大型企业&#xff0c;数量更为庞大的小微企业同样有借助数字化产品、服务来提升企业经营的需求&#xff0c;由此也带来了广袤的数字化分销市场。 这里处在聚光灯之外&#xff0c;很少被数字化时代…

PHP8的类与对象的基本操作之成员变量-PHP8知识详解

成员变量是指在类中定义的变量。在类中可以声明多个变量&#xff0c;所以对象中可以存在多个成员变量&#xff0c;每个变量将存储不同的对象属性信息。 例如以下定义&#xff1a; public class Goods { 关键字 $name; //类的成员变量 }成员属性必须使用关键词进行修饰&#xf…

无涯教程-JavaScript - SUMIFS函数

描述 SUMIFS函数添加其满足多个条件的所有参数。 语法 SUMIFS (sum_range, criteria_range1, criteria1, [criteria_range2, criteria2] ...)争论 Argument描述Required/OptionalSum_rangeThe range of cells to sum.RequiredCriteria_range1 使用Criteria1测试的范围。 Cr…

leetcode646. 最长数对链(java)

最长数对链 题目描述贪心解法二 动态规划 dp 题目描述 难度 - 中等 leetcode646. 最长数对链(java) 给你一个由 n 个数对组成的数对数组 pairs &#xff0c;其中 pairs[i] [lefti, righti] 且 lefti < righti 。 现在&#xff0c;我们定义一种 跟随 关系&#xff0c;当且仅…

RHCSA_Linux 从命令行管理文件

目录 一、文件命令规范&#xff1a; 二、创建链接文件 1、创建软链接文件 2、创建硬链接文件 三、目录操作命令 1、创建目录 -- mkdir 2、统计目录及文件的空间占用情况 -- du 3、删除目录文件 四、创建、删除普通文件 1、创建普通文件 2、删除普通文件 五、数据流和…

Vivado下PLL实验

文章目录 前言一、CMT&#xff08;时钟管理单元&#xff09;1、CMT 简介2、FPGA CMT 框图3、MMCM 框图4、PLL 框图 二、创建工程1、创建工程2、PLL IP 核配置3、进行例化 三、进行仿真1、创建仿真文件2、进行仿真设置3、进行行为级仿真 四、硬件验证1、引脚绑定2、生成比特流文…

SAP 打note步骤

SAP 打note步骤 先确定需要实施的note 1.登录sap支持门户网站&#xff0c;查找note文件。https://support.sap.com/en/index.html 2.下载note文件到本地 3.事务代码SNOTE上传note文件 4.实施note,选中上传note&#xff0c;执行 5.往后一直确认 6.显示已实施成功 7.查看系…

驱动开发练习,platform实现如下功能

实验要求 驱动代码 #include <linux/init.h> #include <linux/module.h> #include <linux/platform_device.h> #include <linux/mod_devicetable.h> #include <linux/of_gpio.h> #include <linux/unistd.h> #include <linux/interrupt…

爬虫技术对携程网旅游景点和酒店信息的数据挖掘和分析应用

导语 爬虫技术是一种通过网络爬取目标网站的数据并进行分析的技术&#xff0c;它可以用于各种领域&#xff0c;如电子商务、社交媒体、新闻、教育等。本文将介绍如何使用爬虫技术对携程网旅游景点和酒店信息进行数据挖掘和分析&#xff0c;以及如何利用Selenium库和代理IP技术…

【element-ui】el-date-picker 之picker-options时间选择区间禁用效果的实现

element-ui 时间选择器的时间区间禁用dom层引入:picker-option <el-date-pickerv-model"searchFormObj.workTime"clearablevalue-formate"yyyy-MM-dd":picker-options"pickerOptions"placeholder"请选择时间" ></el-date-pi…

反转单链表

思路图1&#xff1a; 代码&#xff1a; struct ListNode* reverseList(struct ListNode* head){if(headNULL)//当head是空链表时 {return head; }struct ListNode* n1NULL;struct ListNode* n2head;struct ListNode* n3head->next;if(head->nextNULL)//当链表只有一个节…

SpringCloud——微服务

微服务技术栈 在之前的开发过程中&#xff0c;我们将所有的服务都部署在一台服务器中&#xff0c;当我们的服务开始越来越多&#xff0c;业务越来越复杂&#xff0c;当一台服务器不能承担我们的业务的时候&#xff0c;就需要将不同的业务分开部署在不同的服务器上&#xff0c;…

成集云 | 用友U8集成聚水潭ERP(用友U8主管库存)| 解决方案

源系统成集云目标系统 方案介绍 用友U8是一套企业级的解决方案&#xff0c;可满足不同的制造、商务模式下&#xff0c;不同运营模式下的企业经营管理。它全面集成了财务、生产制造及供应链的成熟应用&#xff0c;并延伸客户管理至客户关系管理&#xff08;CRM&#xff09;&am…

MQTT服务器搭建

本次搭建的MQTT服务器是emqx提供的服务器 1、下载 https://www.emqx.com/en/downloads/broker 从官网下载5.2.0版本emqx-5.2.0-windows-amd64.zip 下载完成直接安装 2、配置&#xff0c;修改端口号 mqtt默认端口号 常规的用法&#xff0c;我们一般使用和开放这两个端口&am…

selenium转到新页面操作以及使用execute_script执行js代码获取页面元素

selenium操作页面&#xff1a;在一个A网页中有按钮&#xff0c;点击后&#xff0c;会新建一个B页面&#xff0c;接下来所有的webdriver操作要全部在B页面中。 A页面中&#xff0c;点击“去签到”后&#xff0c;跳转到B页面。 A&#xff1a; B&#xff1a; 代码如下&#xff…

QGIS怎么修改源代码?持续更新...

修改配置文件保存位置 修改目的&#xff1a;放着和本地安装的其他QGIS共用一份配置文件 修改文件&#xff1a;core/qgsuserprofilemanager.cpp 修改位置&#xff1a;第37行 return basePath QDir::separator() "my_profiles";修改完毕后&#xff0c;再次生成一下…

【操作系统】聊聊磁盘IO是如何工作的

磁盘 机械磁盘 主要是由盘片和读写磁头组成。数据存储在盘片的的环状磁道上&#xff0c;读写数据前需要移动磁头&#xff0c;先找到对应的磁道&#xff0c;然后才可以访问数据。 如果数据都在同一磁道上&#xff0c;不需要在进行切换磁道&#xff0c;这就是连续IO&#xff0c;可…

uview组件库的安装

更多的请查看官方文档uView 2.0 - 全面兼容 nvue 的 uni-app 生态框架 - uni-app UI 框架 (uviewui.com) // 如果您的根目录没有package.json文件的话&#xff0c;请先执行如下命令&#xff1a; // npm init -y 安装 npm install uview-ui2.0.36 // 更新 // npm update uvie…