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

Vue的八个基础命令及作用

1.v-text

作用:获取data数据, 设置标签的内容,以纯文本进行显示v-text 会覆盖 标签中的内容,如果想要拼接数据,可以直接在v-text中拼接如果拼接的是数字:直接使用 “+”如果拼接的是字符串,需要使用与外部不同的引号进行包裹内容

2.v-html

作用:可以当做 v-text 一样使用,显示普通文本,设置元素的 innerHTML (可以向元素中写入新的标签)

3.v-on

作用: 为元素绑定事件, 比如: v-on:click,可以简写为 @click="方法

4.v-show

作用: v-show 需要一个 boolean 类型的值,根据值的变化,进行标签的显示和隐藏

5.v-if

作用: 根据表达值的真假,切换元素的显示和隐藏( 操纵dom 元素 )

原理:会操作 DOM 元素,将元素删除或添加,而不是像 v-show 一样修改样式,使用场景:频繁切换使用 v-show,反之使用 v-if

6.v-bind

作用: 设置元素的属性 (比如:src,title,class,style传递json串

一次只能修改一个属性         v-bind:属性名=“属性值”:            属性名

7.v-for

作用: 根据数据生成列表结构,常与数组一起使用,进行遍历操作

v-for="item,index in arr1"

v-for="person in persons"

push():将元素追加进入数组
shift():将数组的起始元素删除
数组的长度变化,会同步更新到页面上,是响应式的

8 v-on 

作用:可以向函数传递参数,事件修饰符,可以制定哪些方式触发事件,比如说按键,回车等

相关文章:

Vue的八个基础命令及作用

1.v-text 作用:获取data数据, 设置标签的内容,以纯文本进行显示v-text 会覆盖 标签中的内容,如果想要拼接数据,可以直接在v-text中拼接如果拼接的是数字:直接使用 “”如果拼接的是字符串,需要使用与外部不同的引号进…...

Log日志详解分析

目录 1、log日志的用途2、log日志级别3、什么时候需要输出日志1. 系统启动参数、环境变量2. 异常捕获处3. 函数获得期望之外的结果时4. 关键操作 4、日志输出的内容5、 注意事项1. 日志信息不明确2. 特殊异常处理3. 日志输出顺序4. 临时调试日志 6、xml文件配置7、linux下查看日…...

【API篇】九、Flink的水位线

文章目录 1、Flink时间语义2、事件时间和窗口3、水位线4、水位线和窗口的工作原理 1、Flink时间语义 事件时间处理时间 举个例子就是,一条数据在23:59:59产生,在00:00:01被处理,前者为事件时间,后者为处理时间。 从Flink1.12版本…...

#经典论文 异质山坡的物理模型 2 有效导水率

Binley, A., Beven, K., & Elgy, J. (1989). A physically based model of heterogeneous hillslopes: 2. Effective hydraulic conductivities. Water Resources Research, 25(6), 1227–1233. https://doi.org/10.1029/WR025i006p01227 这篇论文指出, 每个输…...

Java面试题-Redis-第一天(Redis简单介绍)

目录 一、Redis是什么?优缺点? 二、Redis为什么这么快? 三、Redis相较于Memcached有哪些优势? 四、为什么使用Redis做缓存? 五、为什么要用Redis而不用map/guava做缓存? 六、Redis的常用场景有哪些&am…...

Java 生成和读取JSON文件

下面的demo当中 &#xff0c;是将json文件放到了zip包当中。如果不需要&#xff0c;可以拿掉。 1、生成对象JSON文件 public static void crateJson() {try {String orcPath "D:\\doc\\ts_service_orchestration.json";// 对象集合或者对象都可以List<DataPO>…...

k8s-----26、细粒度权限管理 RBAC

0、导读 每一个用户对API资源进行操作都需要通经过以下三个步骤: 第一步:对客户端访问进行认证操作,确认是否具有访问k8s权限(也就是通过serviceaccount) token(共享秘钥) SSL(双向SSL认证) …通过任何一个认证即表示认证通过,进入下一步第二步:授权检查,确认是否对资源…...

【Unity ShaderGraph】| 制作一个 高级流体水球效果

前言 【Unity ShaderGraph】| 快速制作一个 流体水球效果一、效果展示二、简易流体水球效果三、进阶流体水球效果四、应用实例 前言 本文将使用ShaderGraph制作一个 高级流体水球 &#xff0c;可以直接拿到项目中使用。对ShaderGraph还不了解的小伙伴可以参考这篇文章&#xf…...

日常软件游戏丢失msvcp120dll怎么修复?分享5个修复方法

在计算机使用过程中&#xff0c;我们经常会遇到一些错误提示&#xff0c;其中之一就是“msvcp120dll丢失”。那么&#xff0c;究竟什么是msvcp120dll文件&#xff1f;当它丢失时&#xff0c;我们会遇到哪些问题呢&#xff1f;本文将从以下几个方面进行详细阐述。 msvcp120dll是…...

自动驾驶之—2D到3D升维

前言&#xff1a; 最近在学习自动驾驶方向的东西&#xff0c;简单整理一些学习笔记&#xff0c;学习过程中发现宝藏up 手写AI 3D卷积 3D卷积的作用&#xff1a;对于2DCNN&#xff0c;我们知道可以很好的处理单张图片中的信息&#xff0c;但是其对于视频这种由多帧图像组成的图…...

ubuntu18.4(后改为20.4)部署chatglm2并进行基于 P-Tuning v2 的微调

下载驱动 NVIDIA显卡驱动官方下载地址 下载好对应驱动并放在某个目录下&#xff0c; 在Linux系统中安装NVIDIA显卡驱动前,建议先卸载Linux系统自带的显卡驱动nouveau。 禁用nouveau 首先&#xff0c;编辑黑名单配置。 vim /etc/modprobe.d/blacklist.conf 在文件的最后添加…...

爬虫-获取数据xpath

安装lxml pip3 install lxml基本用法 import reauests from lxml import etree url = xxx res = reuests.get(url).text html = etree.HTML(res) # 获取所有div标签 xpath = //div print(html.xpath(xpath)) #获取id=xx的div标签下的class=yy的span标签 xpath = //div[@id=&quo…...

SpringBoot中使用JdbcTemplate访问Oracle数据库

Oracle相信大家都不陌生吧&#xff0c;一个大型的数据库&#xff0c;至于数据库&#xff0c;我相信各位都比较熟悉了&#xff0c;一个软件系统&#xff0c;不论是我们常做的App、小程序、还是传统的web站点&#xff0c;我们都有用户的信息&#xff0c;相关业务的数据&#xff0…...

【Linux】权限完结

个人主页点击直达&#xff1a;小白不是程序媛 系列专栏&#xff1a;Linux被操作记 目录 前言 chown指令 chgrp指令 文件类型 file指令 目录的权限 粘滞位 umask指令 权限总结 前言 上篇文章我们说到对于一个文件所属者和所属组都是同一个人时&#xff0c;使用所属者身…...

计算机网络-应用层(3)

一、FTP 文件传输协议 (File Transfer Protocol,FTP) 简称为“文传协 议”,用于在Internet上控制文件的双向传输。 FTP 客户上传文 件时&#xff0c;通过服务器20号端口建立的连接是建立在TCP 之上的数 据连接&#xff0c;通过服务器21号端口建立的连接是建立在TCP 之上的控制连…...

虎去兔来(C++)

系列文章目录 进阶的卡莎C++_睡觉觉觉得的博客-CSDN博客数1的个数_睡觉觉觉得的博客-CSDN博客双精度浮点数的输入输出_睡觉觉觉得的博客-CSDN博客足球联赛积分_睡觉觉觉得的博客-CSDN博客大减价(一级)_睡觉觉觉得的博客-CSDN博客小写字母的判断_睡觉觉觉得的博客-CSDN博客纸币(…...

docker基础镜像定制

docker基础镜像定制 1 简言2.准备软件源文件sources.list3.制作基础镜像3.1 编写Dockerfile命令3.2 制作基础镜像k8sbase1.03.3 测试基础镜像1 简言 官方基础镜像一般自带的linux命令是比较少,tcpdump、telnet登等命令是没有的,这时,定制一套适合自己的基础镜像是必要的,在…...

解决git action定时任务执行失败的方法

为了测试git action定时任务是否有效&#xff0c;你可能选择一个最近的时间测试&#xff0c; 但是发现怎么也触发不了&#xff0c;是不是觉得很苦恼。但是同样的时间&#xff0c;在第二天的定时任务又能成功运行。 这是什么原因&#xff1f; 原因就在上图&#xff0c;git act…...

Node编写重置用户密码接口

目录 前言 定义路由和处理函数 验证表单数据 实现重置密码功能 前言 接前面文章&#xff0c;本文介绍如何编写重置用户密码接口 定义路由和处理函数 路由 // 重置密码的路由 router.post(/updatepwd, userinfo_handler.updatePassword) 处理函数 exports.updatePasswo…...

Day13力扣打卡

打卡记录 奖励最顶尖的 k 名学生(哈希表排序) 用哈希表对所有的positive与negative词条进行映射&#xff0c;然后遍历求解。tip&#xff1a;常用的分割字符串的操作&#xff1a;1.stringstream配合getline() [格式buf, string, char]2.string.find()[find未找到目标会返回npos…...

Vim 调用外部命令学习笔记

Vim 外部命令集成完全指南 文章目录 Vim 外部命令集成完全指南核心概念理解命令语法解析语法对比 常用外部命令详解文本排序与去重文本筛选与搜索高级 grep 搜索技巧文本替换与编辑字符处理高级文本处理编程语言处理其他实用命令 范围操作示例指定行范围处理复合命令示例 实用技…...

OpenLayers 可视化之热力图

注&#xff1a;当前使用的是 ol 5.3.0 版本&#xff0c;天地图使用的key请到天地图官网申请&#xff0c;并替换为自己的key 热力图&#xff08;Heatmap&#xff09;又叫热点图&#xff0c;是一种通过特殊高亮显示事物密度分布、变化趋势的数据可视化技术。采用颜色的深浅来显示…...

定时器任务——若依源码分析

分析util包下面的工具类schedule utils&#xff1a; ScheduleUtils 是若依中用于与 Quartz 框架交互的工具类&#xff0c;封装了定时任务的 创建、更新、暂停、删除等核心逻辑。 createScheduleJob createScheduleJob 用于将任务注册到 Quartz&#xff0c;先构建任务的 JobD…...

【算法训练营Day07】字符串part1

文章目录 反转字符串反转字符串II替换数字 反转字符串 题目链接&#xff1a;344. 反转字符串 双指针法&#xff0c;两个指针的元素直接调转即可 class Solution {public void reverseString(char[] s) {int head 0;int end s.length - 1;while(head < end) {char temp …...

让AI看见世界:MCP协议与服务器的工作原理

让AI看见世界&#xff1a;MCP协议与服务器的工作原理 MCP&#xff08;Model Context Protocol&#xff09;是一种创新的通信协议&#xff0c;旨在让大型语言模型能够安全、高效地与外部资源进行交互。在AI技术快速发展的今天&#xff0c;MCP正成为连接AI与现实世界的重要桥梁。…...

3-11单元格区域边界定位(End属性)学习笔记

返回一个Range 对象&#xff0c;只读。该对象代表包含源区域的区域上端下端左端右端的最后一个单元格。等同于按键 End 向上键(End(xlUp))、End向下键(End(xlDown))、End向左键(End(xlToLeft)End向右键(End(xlToRight)) 注意&#xff1a;它移动的位置必须是相连的有内容的单元格…...

【从零开始学习JVM | 第四篇】类加载器和双亲委派机制(高频面试题)

前言&#xff1a; 双亲委派机制对于面试这块来说非常重要&#xff0c;在实际开发中也是经常遇见需要打破双亲委派的需求&#xff0c;今天我们一起来探索一下什么是双亲委派机制&#xff0c;在此之前我们先介绍一下类的加载器。 目录 ​编辑 前言&#xff1a; 类加载器 1. …...

Elastic 获得 AWS 教育 ISV 合作伙伴资质,进一步增强教育解决方案产品组合

作者&#xff1a;来自 Elastic Udayasimha Theepireddy (Uday), Brian Bergholm, Marianna Jonsdottir 通过搜索 AI 和云创新推动教育领域的数字化转型。 我们非常高兴地宣布&#xff0c;Elastic 已获得 AWS 教育 ISV 合作伙伴资质。这一重要认证表明&#xff0c;Elastic 作为 …...

深入解析光敏传感技术:嵌入式仿真平台如何重塑电子工程教学

一、光敏传感技术的物理本质与系统级实现挑战 光敏电阻作为经典的光电传感器件&#xff0c;其工作原理根植于半导体材料的光电导效应。当入射光子能量超过材料带隙宽度时&#xff0c;价带电子受激发跃迁至导带&#xff0c;形成电子-空穴对&#xff0c;导致材料电导率显著提升。…...

基于Python的气象数据分析及可视化研究

目录 一.&#x1f981;前言二.&#x1f981;开源代码与组件使用情况说明三.&#x1f981;核心功能1. ✅算法设计2. ✅PyEcharts库3. ✅Flask框架4. ✅爬虫5. ✅部署项目 四.&#x1f981;演示效果1. 管理员模块1.1 用户管理 2. 用户模块2.1 登录系统2.2 查看实时数据2.3 查看天…...