vue学习第一阶段
vue

什么是Vue?
概念:Vue是一个构建用户页面的渐进式框架
Vue的两种使用方式
- Vue的核心开发 场景: 局部 {\color{red}局部} 局部模块改造
- Vue核心包& Vue插件 工程化开发场景: 整站 {\color{red}整站} 整站开发
Vue2官网
https://v2.cn.vuejs.org/
资料存放地址
D:\BaiduNetdiskDownload\2、最新Vue2+3 入门到实战课程
echarts官网
https://echarts.apache.org/zh/index.html
layui官网
http://layui.xhcen.com/
课件保留地址
D:\BaiduNetdiskDownload\2、最新Vue2+3 入门到实战课程

一、创建vue实例

1.创建html
2.引入vue依赖
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>创建一个Vue实例</title>
</head>
<body>
<!--创建Vue实例,初始化渲染1.准备容器(Vue所有管理的范围)2.引包(开发版本包/生产版本包)官网3.创建实例4.添加配置-》完成渲染
-->
<div id="app"><!--这里将来会编写用于渲染的代码逻辑 --><h1>{{ msg }}</h1><h2>{{name}}</h2><h3>{{age}}</h3>
</div><!-- 开发环境版本,包含了有帮助的命令行警告 (不可以写成:<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"/>)-->
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
<script>//一旦引入了VueJS核心包,在全局环境下,就有了Vue构造函数const app = new Vue({//通过el配置选择器,指定Vue管理的是哪个盒子el: '#app',//通过data提供数据data: {msg:'Hello 黑马',name: 'lzp',age: 18}});
</script>
</body>
</html>
二、插值表达式

三、Vue响应特性


四、Vue指令
语法糖:
1、保留两位小数

2、document.querySelector(‘p’)
通过标签名选择元素,允许你通过提供一个 CSS 选择器来选择文档中的第一个匹配的元素。这个函数返回匹配的元素(如果找到了匹配项),否则返回
null。document.querySelector是一个非常有用的方法,因为它让你可以通过多种选择器轻松地选择和操作 DOM 元素。
value.slice(0, 1),value.slice(1):截取字符
v-html:设置元素的innerHTML,语法:v-html=“表达式”
v-show:控制元素的显示隐藏, t r u e : 显示, f a l s e :隐藏 {\color{red}true:显示,false:隐藏} true:显示,false:隐藏,底层原理切换css的display:none来控制显示隐藏,使用场景,频繁切换显示隐藏的场景
v-if:控制元素的显示隐藏(条件渲染 t r u e : 显示, f a l s e :隐藏 {\color{red}true:显示,false:隐藏}
相关文章:
vue学习第一阶段
vue 什么是Vue? 概念:Vue是一个构建用户页面的渐进式框架 Vue的两种使用方式 Vue的核心开发 场景: 局部 {\color{red}局部} 局部模块改造Vue核心包& Vue插件 工程化开发场景: 整站 {\color{red}整站} 整站开发Vue2官网 https://v2.cn.vuejs.org/ 资料存放地址 D:\Baidu…...
React虚拟DOM:理解和应用
写在前面 在现代前端开发中,React 是一个非常流行的 JavaScript 库,用于构建用户界面。它引入了一个名为“虚拟 DOM”(Virtual DOM)的概念,这个概念对于 React 的高效性能和易用性至关重要。本文将深入探讨 React Vir…...
用python编写一个放烟花的小程序
import pygame import random # 代码解释及使用说明: # 首先,导入 pygame 和 random 库。pygame 用于创建游戏窗口和图形绘制,random 用于生成随机数。 # 初始化 pygame,并设置屏幕尺寸为 800x600 像素,设置窗口标题为…...
Git 仓库与文件管理笔记
Git 的三种仓库概念 本地仓库 (Local Repository) 位于本地 .git 文件夹中通过 git init 或 git clone 创建存储完整的项目历史和分支信息 远程仓库 (Remote Repository) 位于 GitHub、GitLab 等平台服务器使用 git remote -v 查看所有远程仓库默认远程仓库名通常为 origin 工…...
2024 年 docker 提示index.docker.io
发现 docker 提示以下错误: Error response from daemon: Get "https://index.docker.io/v1/search?qnginx&n25": dialing index.docker.io:443 container via direct connection because has no HTTPS proxy: connecting to index.docker.io:443:…...
TCP粘/拆包----自定义消息协议
今天是2024年12月31日,今年的最后一天,希望所有的努力在新的一年会有回报。❀ 无路可退,放弃很难,坚持很酷 TCP传输 是一种面向二进制的,流的传输。在传输过程中最大的问题是消息之间的边界不明确。而在服务端主要的…...
Modbus知识详解
Modbus知识详解 ## 1.什么是Modbus?**顾名思义**,它是一个Bus(总线),即总线协议。比如串口协议、IIC协议、SPI都是通信协议。你接触到这种协议,相信你所处的行业是工业电子方面或者你的产品用于工业。好了,…...
Java-创建一个结合CompletableFuture和自定义功能的工具类
1.重试机制:当异步任务失败时自动重试。 2.超时重试:在指定时间内未完成的任务进行重试。 3.批量处理:将多个任务批量执行并收集结果。 4.日志记录:为每个异步任务添加日志记录,便于调试和监控。 5.自定义线程池:允许用户传入自定义的线程池配置。 import java.util…...
【MATLAB第111期】基于MATLAB的sobol全局敏感性分析方法二阶指数计算
【MATLAB第111期】基于MATLAB的sobol全局敏感性分析方法二阶指数计算 一、简介 在MATLAB中计算Sobol二阶效应指数通常涉及到全局敏感性分析(Global Sensitivity Analysis, GSA),其中Sobol方法是一种流行的技术,用于评估模型输入…...
C语言-sprintf
sprintf是一个在C语言中用于字符串格式化的函数,其功能是将格式化的数据写入某个字符串中。该函数定义stdio.h在头文件中,原型为: int sprintf(char *string, const char *format, ...); 函数参数 string:指向一个字符数组的指针&#…...
APM 3.0.2 | 聚合B站、油管和MF的音乐播放器,支持歌词匹配
APM(Azusa-Player-Mobile)是一款基于B站的第三方音频播放器,现已扩展支持YouTube Music、YouTube、本地音乐、AList和MusicFree等平台。它不仅提供视频作为音频播放,还具备排行榜、分区动态等功能。用户可以通过添加Alist地址接入…...
Mono 和 IL2Cpp的区别
Mono特征: 标准项目中有Assembly-CSharp.dll , 但在更复杂的项目或特定配置中,可能会有其他.dll或结构变更 在游戏的数据目录下看到一系列的.dll文件,这些文件的语言一般为中间语言 CE附加 , 查看是否有Mono.dll相关模块 目录有MonoBleedingEdge文件夹 IL2Cpp 标准项目应该…...
力扣第389题—找不同
class Solution:def findTheDifference(self, s: str, t: str) -> str:# 对字符串 s 和 t 进行排序a sorted(s)b sorted(t)# 比较排序后的两个列表for i in range(len(a)):if a[i] ! b[i]:return b[i]# 如果前面的比较没有找到差异,那么差异字符在 t 的最后一个…...
我的桌面 1.9.75 | 个性化定制手机桌面,丰富的小组件和主题
我的桌面iScreen是一款万能桌面小组件APP,提供各种高颜值桌面主题与创意小组件自由组合。支持X面板、照片、待办清单、时钟、日历等实用有趣的小组件。拥有超过500种小组件供选择,包括灵动面板、滚动相册等,搭配300多种精美主题和高清壁纸&am…...
【Java项目】基于SpringBoot的【垃圾分类系统】
【Java项目】基于SpringBoot的【垃圾分类系统】 技术简介:本系统使用采用B/S架构、Spring Boot框架、MYSQL数据库进行开发设计。 系统简介:使用者分为管理员和用户、垃圾分类管理员,实现功能包括管理员:首页、个人中心、用户管理、…...
生成埃里克卡特曼人工智能语音听起来像他或配音视频
您是《南方公园》和迷人角色埃里克卡特曼的忠实粉丝吗?您是否渴望获得标志性的埃里克卡特曼 AI 语音,将他的动画魅力融入到您的数字内容、游戏或流媒体体验中?如果答案是肯定的,那么您来对地方了! 在本文中࿰…...
C语言中的va_list
目录 1. 可变参数函数(Variadic Function) 2. va_list 及相关宏 3. va_list 的用途 4. 与 printf、vsnprintf 等函数的关系 5. 在实际场景中的示例 5.1 API_SendAtCommandParam 函数 5.2 va_arg 直接取参数 6. 常见问题 7. 结论 在 C 语言中&am…...
idea无法安装插件
目录 修改工具配置 本地安装 无法下载很多时候就是延迟太高导致的,我们先打开插件官网看一下 Python - IntelliJ IDEs Plugin | Marketplace 修改工具配置 1、配置代理(点击 setting-点击 plugins-在点击 http proxy Settings) 输入&…...
智汇厦门:苏哒智能携其智能化产品亮相文心中国行现场
2025年1月2日,文心中国行再次踏足美丽的鹭岛厦门。 本次的文心中国行活动不仅有来自政府、高校及企业的精英专家将齐聚一堂,分享AI与大模型的最新研究成果,还正式揭牌百度飞桨(厦门)人工智能产业赋能中心,…...
C++函数模板的定义为何要和调用点放在一起
在C中,模板的声明最好和调用放在一起,或者确保编译器在进行模板实例化时能看到模板完整的定义,主要有以下几方面原因: 一、模板实例化机制的需求 编译时实例化特点 C模板是在编译阶段根据实际使用时传入的类型参数进行实例化&am…...
练习(含atoi的模拟实现,自定义类型等练习)
一、结构体大小的计算及位段 (结构体大小计算及位段 详解请看:自定义类型:结构体进阶-CSDN博客) 1.在32位系统环境,编译选项为4字节对齐,那么sizeof(A)和sizeof(B)是多少? #pragma pack(4)st…...
el-switch文字内置
el-switch文字内置 效果 vue <div style"color:#ffffff;font-size:14px;float:left;margin-bottom:5px;margin-right:5px;">自动加载</div> <el-switch v-model"value" active-color"#3E99FB" inactive-color"#DCDFE6"…...
P3 QT项目----记事本(3.8)
3.8 记事本项目总结 项目源码 1.main.cpp #include "widget.h" #include <QApplication> int main(int argc, char *argv[]) {QApplication a(argc, argv);Widget w;w.show();return a.exec(); } 2.widget.cpp #include "widget.h" #include &q…...
IoT/HCIP实验-3/LiteOS操作系统内核实验(任务、内存、信号量、CMSIS..)
文章目录 概述HelloWorld 工程C/C配置编译器主配置Makefile脚本烧录器主配置运行结果程序调用栈 任务管理实验实验结果osal 系统适配层osal_task_create 其他实验实验源码内存管理实验互斥锁实验信号量实验 CMISIS接口实验还是得JlINKCMSIS 简介LiteOS->CMSIS任务间消息交互…...
蓝桥杯3498 01串的熵
问题描述 对于一个长度为 23333333的 01 串, 如果其信息熵为 11625907.5798, 且 0 出现次数比 1 少, 那么这个 01 串中 0 出现了多少次? #include<iostream> #include<cmath> using namespace std;int n 23333333;int main() {//枚举 0 出现的次数//因…...
Unity | AmplifyShaderEditor插件基础(第七集:平面波动shader)
目录 一、👋🏻前言 二、😈sinx波动的基本原理 三、😈波动起来 1.sinx节点介绍 2.vertexPosition 3.集成Vector3 a.节点Append b.连起来 4.波动起来 a.波动的原理 b.时间节点 c.sinx的处理 四、🌊波动优化…...
GC1808高性能24位立体声音频ADC芯片解析
1. 芯片概述 GC1808是一款24位立体声音频模数转换器(ADC),支持8kHz~96kHz采样率,集成Δ-Σ调制器、数字抗混叠滤波器和高通滤波器,适用于高保真音频采集场景。 2. 核心特性 高精度:24位分辨率,…...
学校时钟系统,标准考场时钟系统,AI亮相2025高考,赛思时钟系统为教育公平筑起“精准防线”
2025年#高考 将在近日拉开帷幕,#AI 监考一度冲上热搜。当AI深度融入高考,#时间同步 不再是辅助功能,而是决定AI监考系统成败的“生命线”。 AI亮相2025高考,40种异常行为0.5秒精准识别 2025年高考即将拉开帷幕,江西、…...
微软PowerBI考试 PL300-在 Power BI 中清理、转换和加载数据
微软PowerBI考试 PL300-在 Power BI 中清理、转换和加载数据 Power Query 具有大量专门帮助您清理和准备数据以供分析的功能。 您将了解如何简化复杂模型、更改数据类型、重命名对象和透视数据。 您还将了解如何分析列,以便知晓哪些列包含有价值的数据,…...
云原生玩法三问:构建自定义开发环境
云原生玩法三问:构建自定义开发环境 引言 临时运维一个古董项目,无文档,无环境,无交接人,俗称三无。 运行设备的环境老,本地环境版本高,ssh不过去。正好最近对 腾讯出品的云原生 cnb 感兴趣&…...
