39 vue.js

ops/2024/9/24 21:19:59/

1.1  vue是什么?

vue是当下主流的前端框架,用于构建用户界面的  渐进式    自底向上增量开发的MVVM框架。

渐进式:其实每个框架都有自己的特点,在开发的过程中,可以在原有的系统上,把其中一两个功能用VUE开发,也可以整个系统都用VUE开发,------不会做职责以外的事情。

自底向上增量开发:就是先把页面写好,然后在写好的页面的基础上,再去逐一添加功能和效果,由简单到繁琐的过程。

1.2  vue的特点?

Vue.js 是一款轻量、高效、灵活且易上手的 JavaScript 框架,具有以下特点:

  1. 渐进式框架:Vue.js 是一款渐进式框架,可以将它作为一个库来使用,也可以将它作为一个完整的框架来使用。这使得它非常灵活和可扩展。

  2. 双向数据绑定:Vue.js 支持双向数据绑定,即当数据发生变化时,视图会自动更新,当视图发生变化时,数据也会自动更新。

  3. 组件化开发:Vue.js 采用组件化开发,可以将一个页面拆分成多个独立的组件,每个组件具有自己的状态和行为,可以通过 props 和 events 来进行组件之间的通信。

  4. 模板语法:Vue.js 的模板语法简洁易懂,支持插值、指令、过滤器等,使得编写模板变得更加简单。

  5. 虚拟 DOM:Vue.js 使用虚拟 DOM 技术来优化 DOM 操作,可以避免频繁操作 DOM 导致性能下降的问题。

  6. 生命周期:Vue.js 组件具有生命周期,可以在组件的不同阶段做出相应的操作,例如在 created 钩子函数中初始化数据,在 mounted 钩子函数中进行 DOM 操作等。

  7. 插件机制:Vue.js 提供了插件机制,可以方便地扩展 Vue.js 的功能,例如 Vue Router、Vuex 等。

1.3  什么是MVVM?

是Model-View-ViewModel的简写

M:model   模型 > 数据 > 变量    data数据

V:view      视图 > 页面               模板

VM:viewModel 视图模型>用来关联数据与视图之前的桥梁 vue实例

1.4  可以建多个VUE实例吗?怎么用?

创建多个实例代码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="./node_modules/vue/dist/vue.js"></script>
</head>
<body><div id="demoDiv"><h1>{{text}}</h1></div><div id="demoDivb"><h1>{{text}}</h1></div><script>new Vue({el:"#demoDiv",data:{text:"我是第一个实例",}})new Vue({el:"#demoDivb",data:{text:"我是第二个实例"}})</script></body>
</html>

1.5  {{}}是什么?

{{}}:它是VUE中的一种语法,它有很多名字,模板语法 双花括号赋值法 vue数据插值

作用:在{{}}中间写的表达式,可以直接在页面中解析并展示。

语法:{{表达式}}

下期更新:

vue的延迟挂载是什么?$mount是什么?

data的写法分别是什么?

什么是指令?

v-model 作用

双向绑定是什么与原理

v-show是什么?


http://www.ppmy.cn/ops/16503.html

相关文章

循环神经网络介绍(RNN)

序列模型 定义&#xff1a;自然语言处理、音频、视频以及其他序列数据的模型 类型&#xff1a; 语音识别 情感分析 机器翻译 特点&#xff1a; 序列数据前后之间有很强的关联性 序列数据的输入输出长度不固定 循环神经网络 定义&#xff1a;循环&#xff08;递归&#xff…

赋能智慧校园!A3D数字孪生可视化,轻量又高效!

放假之后&#xff0c;学生们会逐步返学&#xff0c;大量人员出入校园&#xff0c;安全更是不容忽视&#xff0c;如何在短时间内对大批人员及设施进行智能监管&#xff1f;数字化转型是关键手段&#xff0c;我们可以融合线上线下数据&#xff0c;搭建3D立体的智慧校园&#xff0…

多客圈子交友系统 uniapp+thinkphp6适配小程序/H5/app/api全开源,多款插件自选,支持个性定制!

网上交友的优点包括&#xff1a; 1. 方便&#xff1a;网上交友可以随时随地进行&#xff0c;不受时间和空间的限制&#xff0c;方便且高效。 2. 匿名性&#xff1a;网上交友可以实现匿名性&#xff0c;用户可以匿名地搜索、聊天或交换信息&#xff0c;保护个人隐私和安全。 3.…

OpenStack云计算(十)——OpenStack虚拟机实例管理,增加一个计算节点并进行实例冷迁移,增加一个计算节点的步骤,实例冷迁移的操作方法

项目实训一 本实训任务对实验环境要求较高&#xff0c;而且过程比较复杂&#xff0c;涉及的步骤非常多&#xff0c;有一定难度&#xff0c;可根据需要选做。可以考虑改为直接观看相关的微课视频 【实训题目】 增加一个计算节点并进行实例冷迁移 【实训目的】 熟悉增加一个…

云计算革新:以太网 Scale-UP 网络为 GPU 加速赋能

谈谈基于以太网的GPU Scale-UP网络 Intel Gaudi-3 采用 RoCE 互联技术&#xff0c;促进了 Scale-UP 解决方案。业界专家 Jim Keller 倡导以太网替代 NVLink。Tenstorrent 成功应用以太网实现片上网络互联。RoCE 和以太网已成为互联解决方案的新兴趋势&#xff0c;为高性能计算提…

Docker资源管理-数据管理

一、CPU 资源控制&#xff1a; 1.cgroups&#xff1a; cgroups&#xff0c;是一个非常强大的linux内核工具&#xff0c;他不仅可以限制被 namespace 隔离起来的资源&#xff0c; 还可以为资源设置权重、计算使用量、操控进程启停等等。 所以 cgroups&#xff08;Control grou…

Docker 的数据管理 端口映射 容器互联 镜像的创建

目录 概念 概念 管理 Docker 容器中数据主要有两种方式&#xff1a;数据卷&#xff08;Data Volumes&#xff09;和数据卷容器&#xff08;DataVolumes Containers&#xff09;。总结&#xff1a;因为容器数据是临时保存的为了安全&#xff0c;就要让数据保持持久化。 1&#…

C/C++开发,opencv-ml库学习,支持决策树(DTrees)应用

目录 一、决策树&#xff08;DTrees&#xff09; 1.1决策树算法简介 1.2 OpenCV决策树 二、cv::ml::DTrees 库应用 2.1 训练及样本数据准备 2.2 程序编译 2.3 main.cpp全代码 一、决策树&#xff08;DTrees&#xff09; 1.1决策树算法简介 决策树&#xff08;Decision T…