Web前端—Vue

   Vue是一套前端框架,免除原生JS中的DOM操作,简化书写。基于MVVM思想,实现了数据的双向绑定,将编程的关注点放在数据上。

框架

框架是一个半成品软件,是一套可重用的,通用的,软件基础代码模型。基于框架进行开发,更加快捷高效。

  • 框架规定了自己的编程方式,是一套完整的解决方案
  • 使用框架的时候,由框架控制一切,我们只需要按照规则写代码

MVVM

Model是数据模型

VIEW是视图层,负责数据的展示,也就是HTML文件的标签,也就是DOM元素

  • 在前端中经常要通过 JS代码 来进行一些逻辑操作,最终还要把这些逻辑操作的结果现在页面中。也就是需要频繁的操作DOM
  • MVVM通过数据双向绑定让数据自动地双向同步

    • V(修改数据) -> M随之修改
    • M(修改数据) -> V随之修改
    • 数据是核心

VUE使用方式

1.在HTML页面引入vue.js文件

这个文件是官方提供的一个文件,要使用vue必须引入这个文件

2.在JS代码区域创建vue对象,定义数据模型

  • el是vue控制的区域,类似于CSS的选择器
  • data是数据模型对象

3.编写视图

  • 视图中的message是绑定的数据模型
  • {{ }}是插值表达式,作用是把数据模型的内容展示出来,内容可以是变量,三元运算符,函数调用,算数运算

常用的vue指令

下面举几个例子:

1.通过v-bind绑定href

2.通过v-on让点击按钮绑定事件

3.通过v-if输入数字展示对应文本

4.通过v-for进行列表渲染展示

生命周期

指一个对象从创建到销毁的整个过程。

生命周期的八个状态:每触发一个生命周期事件,会自动执行一个生命周期方法

我们常常在mounted方法来发送请求到服务端来请求数据

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

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

相关文章

树的遍历方式DFS和BFS

DFS(depth first search) 深度优先遍历 从图中一个未访问的顶点V开始,沿着一条路一直走到底,然后从这条路尽头的节点回退到上一个节点,再从另一条路走到底…不断递归重复这个过程,直到所有的顶点都遍历完成。前序遍历&#xff0c…

Git bash获取ssh key

目录 1、获取密钥 2、查看密钥 3、在vs中向GitHub推送代码 4、重新向GitHub推送修改过的代码 1、获取密钥 指令:ssh-keygen -t rsa -C "邮箱地址" 连续按三次回车,直到出现类似以下界面: 2、查看密钥 路径:C:\U…

Java-3-异常处理

概述与异常体系结构 在Java中,将程序执行中发生的不正常情况称为“异常”,开发过程中的语法错误和逻辑错误不是异常。 分类: Error:JVM无法解决的严重问题,如系统内部错误、资源耗尽等等,比如&#xff1…

小车倒立摆系统极点配置,LQR闭环控制

在之前直流电机控制仿真里有讲过状态控制的基本架构,有兴趣的同学可以再回去看看,链接如下好玩的直流电机调速实验、PID、极点配置、LQR、观测器;不讲大道理_lqr控制器观测器-CSDN博客 在专栏的前三篇文章 小车倒立摆物理建模与simulink仿真…

电脑不能读取移动硬盘,但是可以读取U盘解决方法

找到此电脑 右键设备管理器,找到其中的通用串行总线控制器。 注意,凡是插入到电脑当中不能读取的U盘或者移动硬盘,都会在通用串行总线控制器当中显示为USB大容量存储设备 鼠标选中“USB大容量存储设备”,右键卸载它。此时&#x…

蓝桥杯 2023 省A 颜色平衡树

树上启发式合并是一个巧妙的方法。 dsu on tree,可以称为树上启发式合并,是一种巧妙的暴力。用一个全局数组存储结果,对于每棵子树,有以下操作: 先遍历轻儿子,处理完轻儿子后将数组清零(要再…

Kotlin的lateinit关键词

Kotlin的lateinit关键词 lateinit,延迟初始化。有时,并不能定义一个变量或对象值为空,而也没办法在对象或变量在定义声明时就为它赋值初始化,那么这时就需要用到Kotlin提供的延迟初始化lateinit。比如,有些依赖注入框架…

简述C语言文件操作

🌈 个人主页:白子寰 🔥 分类专栏:魔法指针,进阶C,C语言,C语言题集,C语言实现游戏👈 希望得到您的订阅和支持~ 💡 坚持创作博文(平均质量分79),分享…

蓝桥杯(2):python基础算法【上】

时间复杂度、枚举、模拟、递归、进制转换、前缀和、差分、离散化 1 时间复杂度 重要是看循环,一共运行了几次 1.1 简单代码看循环 #时间复杂度1 n int(input()) for i in range(1,n1):for j in range(0,i):pass ###时间复杂度:123....nn(1n)/2 所以…

银行5G短消息应用架构设计

(一)RCS简介 1.1 RCS的提出与标准制定 RCS(Rich Communication Services & Suite,富媒体通信)是GSMA(Groupe Speciale Mobile Association,全球移动通信系统协会)在2008年提出的一种通讯方式,RCS融合了语音、消息…

《自动机理论、语言和计算导论》阅读笔记:p1-p4

《自动机理论、语言和计算导论》学习第1天,p1-p4,总计4页。这只是个人的学习记录,因为很多东西不懂,难免存在理解错误的地方。 一、技术总结 1.有限自动机(finite automata)示例 1.software for checking digital circuits。 …

部署mysql,前端,后端

部署mysql docker pull mysql 从镜像源中拉取镜像。 创建mysql容器 docker run -d \--name mysql_container \-p 3306:3306 \-e TZAsia/Shanghai \-e MYSQL_ROOT_PASSWORD123 \--restartalways \-v /opt/mysql:/var/lib/mysql \mysql -d后台运行,--name指定容器…