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

模板语法指令语法——02

news 2025/7/8 12:01:33

//指令语法：

1.什么是指定，有什么作用？

指令的职责是，当表达式的值改变时，将其产生的连带影响，响应式的作用语DOM

2.vue框架中的所有指令的名字都以v-开始的

3.插值是写在标签当中用的，指令写在

vue框加所有的指令都以Html 标签的属性的形式存在的，

例如：<span 指令写 在这 >{{这里是插值语法的位置}}</span>

注意：虽然指令是写在标签的属性位置上，但是这个命令浏览器是无法看懂的，是 需 要先让vue框架进行编译，编译之后的内容都是浏览器可以看到的

4.指令的语法规则

指令的一个语法格式

<HTML 标签 v-指令名：参数 = “表达式”></HTML>

表达式，之前在插值语法中{{这里可以写什么}}，那么指令中的表达式就可以写什么，实际上是一模一样的。但是需要注意的是，在指令中的表达式位置不能再外层添加{{}}

不是所有的指令都有参数和表达式

有的指令，不需要参数，也不需要表达式 例：v-once

有的指令，不需要参数，但是需要表达式，例 ：v-if = “表达式”

有的指令，既需要参数，也需要表达式 例： v-bind : 参数 = “表达式”

  1. v-once指令

作用：只渲染元素一次，随后重新渲染，元素及其所有的子节点将被现为静态内存并跳过，这可以用于优化更新性能

  1. v-if = "表达式"指令

作用：表达式的执行结果需要一个布尔类型的数据： true或者 false

true：这个指令所在的标签会被渲染到浏览器当中去

false：这个指令所在的标签不会被渲染到浏览器当中去

<body>

<div id ='app'>

<h1>{{msg}}</h1/>

<h1 v-once> {{msg}} </h1>

<h1 v-if="a>b">测试：{{msg}} </h1>

</div>

<script>

new Vue （{

el : '#app'

data(){

msg : ' qwert'

a : ' 20'

b : ' 21'

}

}）

</scirpt>

</body>

相关文章：

模板语法指令语法——02

//指令语法&#xff1a; 1.什么是指定&#xff0c;有什么作用&#xff1f; 指令的职责是&#xff0c;当表达式的值改变时&#xff0c;将其产生的连带影响&#xff0c;响应式的作用语DOM 2.vue框架中的所有指令的名字都以v-开始的 3.插值是写在标签当中用的&#xff0c;指令…...

编程日记 2024/7/12 12:32:52

Comparable 和 Comparator 接口的区别

Comparable 和 Comparator 接口的区别 1、Comparable 接口1.1 compareTo() 方法 2、Comparator 接口2.1 compare() 方法 3、 Comparable 和 Comparator 的区别总结 &#x1f496;The Begin&#x1f496;点点关注&#xff0c;收藏不迷路&#x1f496; 在Java中&#xff0c;Compa…...

编程日记 2024/7/12 12:30:50

Python requests爬虫

Python的requests库是一个强大且易于使用的HTTP库&#xff0c;用于发送HTTP请求和处理响应。它是Python中最受欢迎的网络爬虫框架之一&#xff0c;被广泛用于从网页中提取数据、爬取网站和进行API调用。 使用requests库&#xff0c;你可以轻松地发送各种HTTP请求&#xff0c;包…...

编程日记 2024/7/12 12:27:47

Docker 基本管理及部署

目录 1.Docker概述 1.1 Docker是什么&#xff1f; 1.2 Docker的宗旨 1.3 容器的优点 1.4 Docker与虚拟机的区别 1.5 容器在内核中支持的两种技术 1.6 namespace的六大类型 2.Docker核心概念 2.1 镜像 2.2 容器 2.3 仓库 3.安装Docker 3.1 查看 docker 版本信息 4.…...

编程日记 2024/7/12 12:26:46

Ubuntu下安装配置和调优Docker,支持IPV6

今天在阿贝云的免费云服务器上折腾了一番Docker的配置和优化,这家免费云服务器可真不错啊。1核1G 10G硬盘,5M带宽,配置虽然简单但够用了。作为一个免费的云服务器,阿贝云的性能可以说是非常不错的了,完全能胜任日常的开发和部署工作。 让我们开始吧。首先,简单介绍一下Docker吧…...

编程日记 2024/7/12 12:25:45

Proteus + Keil单片机仿真教程（六）多位LED数码管的动态显示

上一节我们通过锁存器和八个八位数码管实现了多个数码管的静态显示，这节主要讲解多位数码管的动态显示，所谓的动态显示就是对两个锁存器的控制。考虑一个问题，现在给WS位锁存器增加一个循环，让它从1111 1110到0111 1111会发生什么事情？话不多说，先上代码： #include<…...

编程日记 2024/7/12 12:24:43

WEB开发-HTML页面更新部分内容

1 需求 2 接口 3 示例 在HTML页面中&#xff0c;如果你想要改变部分内容而不是整个页面&#xff0c;有几种方法可以实现这一目标&#xff0c;主要包括&#xff1a; JavaScript 的 DOM 操作 JavaScript允许你动态地修改HTML文档中的元素内容。你可以使用document.getElementB…...

编程日记 2024/7/12 12:23:42

休息时间c++

题目描述 小杨计划在某个时刻开始学习&#xff0c;并决定在学习k秒后开始休息。 小杨想知道自己开始休息的时刻是多少。 输入 前三行每行包含一个整数&#xff0c;分别表示小杨开始学习时刻的时h、分m、秒s(h&#xff0c;m&#xff0c;s的值符合1≤h≤12,0≤m≤59,0≤s≤59)…...

编程日记 2024/7/12 12:22:41

zabbix 自定义监控项及触发器

1. 在zabbix客户端定义脚本 /etc/zabbix/zabbix_agent2.d/目录下创建自定义监控项脚本 ]# cat /etc/zabbix/zabbix_agent2.d/web.conf #UserParameterkey,cmd #UserParameterngx.port,sh /server/scripts/xxx.sh UserParameterngx.port,ss -lntup|grep -w *:80|wc -lUserPar…...

编程日记 2024/7/12 12:21:39

easyExcel 不规则模板导入数据

文章目录 前言一、需求和效果二、难点和思路三、全部代码踩坑 前言 之前分享的 EasyExcel 批量导入并校验数据&#xff0c;仅支持规则excel&#xff0c;即首行表头&#xff0c;下面对应数据&#xff0c;无合并单元格情况。 本篇主要解决问题&#xff1a; 模板excel 表头不在首…...

编程日记 2024/7/12 12:19:35

前端调试技巧(npm Link，vscode调试，浏览器调试等)

Npm Link 功能&#xff1a; 在本地开发npm模块的时候&#xff0c;我们可以使用npm link命令&#xff0c;将npm 模块链接到对应的运行项目中去&#xff0c;方便地对模块进行调试和测试 断点调试 vscode调试 Debug Vue2 Project 目标&#xff1a;在VSCode中调试项目代码…...

编程日记 2024/7/12 12:18:34

SSL证书到期自动巡检脚本-推送钉钉告警

1. 编写SSL证书巡检脚本 cat /hao/batch_check_ssl_expire.sh #!/bin/bash# 域名列表文件绝对路径 domains_file"/hao/domains.txt"#钉钉webhook webhook_url"https://oapi.dingtalk.com/robot/send?access_token99999999999999999999999999999999999999999…...

编程日记 2024/7/12 12:15:31

Winform打印编程基础

1、目的 进行打印设置、打印预览、及实现打印功能 2、代码 using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Drawing.Printing; using System.IO; using System.Linq; using System.Te…...

编程日记 2024/7/12 12:12:23

Python编程实例-Python的隐藏特性

Python的隐藏特性 文章目录 Python的隐藏特性1、Python中的下划线(_)2、通过解析树进行正则表达式调试3、省略号（...）4、dir()函数5、Lambda 函数6、链式比较运算符7、zip()函数8、修饰器9、上下文管理器和with语句10、生成器和yield语句11、元类（Metaclass）12、小结Python…...

编程日记 2024/7/12 12:08:19

防火墙安全策略利用

拓扑图&#xff1a; 办公区为10.0.1.0/24 生产部为&#xff1a;10.0.2.0/24 办公区为vlan2&#xff0c;生产区为vlan3 DMZ区域为10.0.3.0/24、10.0.3.10为HTTP服务器 游客区&#xff1a;210.0.0./24 ISP&#xff1a;12.0.0.0/24 要求3&#xff1a; 添加安全策略&#xf…...

编程日记 2024/7/12 12:07:19

SystemUIService启动-Android13

SystemUIService启动-Android13 1、SystemUIService启动2、其他SystemUI services启动2.1 Dagger依赖注入2.2 Recents为例 1、SystemUIService启动 SystemUI启动&#xff0c;及其SystemUIService启动 <!-- SystemUi service component --><string name"config_s…...

编程日记 2024/7/12 12:06:18

linux权限深度解析——探索原理

前言&#xff1a;本节内容主要讲述的是linux权限相关的内容&#xff0c; linux的权限如果使用root账号是感受不到的&#xff0c; 所以我们要使用普通账号对本节相关内容进行学习&#xff0c;以及一些实验的测试。 然后&#xff0c; 通过linux权限的学习我们可以知道为什么有时候…...

编程日记 2024/7/12 12:05:16

Qt学生管理系统（付源码）

Qt学生管理系统 一、前言1.1 项目介绍1.2 项目目标 2、需求说明2.1 功能性说明2.2 非功能性说明 三、UX设计3.1 登录界面3.2 学生数据展示3.3 信息插入和更新 三、架构说明3.1 客户端结构如下3.2 数据流程图3.2.1 数据管理3.2.2 管理员登录 四、 设计说明3.1 数据库设计3.2 结构…...

编程日记 2024/7/12 12:03:13

重磅！新公司法正式实施，这些变化你必须知道！ ️

新公司法来了&#xff01;企业设立和经营必知的关键变动 &#x1f3db;️&#x1f680; 大家好&#xff0c;我是猫头虎&#xff0c;科技自媒体博主。今天我们来聊聊一件大事——新公司法的实施&#xff0c;这对企业设立和经营带来了哪些重大影响&#xff1f;跟着我&#xff0c…...

编程日记 2024/7/12 12:01:11

[Flask笔记]一个完整的Flask程序

前面讲过Flask是一个轻量级Web开发框架&#xff0c;为什么说是轻量级的呢&#xff0c;因为它用短短几行代码就能运行起来&#xff0c;我们一起来看看最简单的flask框架。 安装Flask 在看Flask框架之前我们需要先安装flask模块&#xff0c;学过python的肯定都知道&#xff0c;…...

编程日记 2024/7/12 11:58:09

R语言AI模型部署方案：精准离线运行详解

R语言AI模型部署方案：精准离线运行详解 一、项目概述 本文将构建一个完整的R语言AI部署解决方案，实现鸢尾花分类模型的训练、保存、离线部署和预测功能。核心特点： 100%离线运行能力自包含环境依赖生产级错误处理跨平台兼容性模型版本管理# 文件结构说明 Iris_AI_Deployme…...

编程新知 2025/6/15 6:20:40

Vue3 + Element Plus + TypeScript中el-transfer穿梭框组件使用详解及示例

使用详解 Element Plus 的 el-transfer 组件是一个强大的穿梭框组件&#xff0c;常用于在两个集合之间进行数据转移&#xff0c;如权限分配、数据选择等场景。下面我将详细介绍其用法并提供一个完整示例。 核心特性与用法 基本属性 v-model&#xff1a;绑定右侧列表的值&…...

编程新知 2025/7/5 22:43:55

从零开始打造 OpenSTLinux 6.6 Yocto 系统（基于STM32CubeMX）（九）

设备树移植 和uboot设备树修改的内容同步到kernel将设备树stm32mp157d-stm32mp157daa1-mx.dts复制到内核源码目录下 源码修改及编译 修改arch/arm/boot/dts/st/Makefile&#xff0c;新增设备树编译 stm32mp157f-ev1-m4-examples.dtb \stm32mp157d-stm32mp157daa1-mx.dtb修改…...

编程新知 2025/7/8 2:03:36

LLM基础1_语言模型如何处理文本

基于GitHub项目&#xff1a;https://github.com/datawhalechina/llms-from-scratch-cn 工具介绍 tiktoken&#xff1a;OpenAI开发的专业"分词器" torch&#xff1a;Facebook开发的强力计算引擎&#xff0c;相当于超级计算器 理解词嵌入&#xff1a;给词语画"…...

编程新知 2025/6/21 14:38:31

Android 之 kotlin 语言学习笔记三（Kotlin-Java 互操作）

参考官方文档&#xff1a;https://developer.android.google.cn/kotlin/interop?hlzh-cn 一、Java&#xff08;供 Kotlin 使用&#xff09; 1、不得使用硬关键字 不要使用 Kotlin 的任何硬关键字作为方法的名称 或字段。允许使用 Kotlin 的软关键字、修饰符关键字和特殊标识…...

编程新知 2025/7/6 2:02:15

大数据学习（132）-HIve数据分析

​​​​&#x1f34b;&#x1f34b;大数据学习&#x1f34b;&#x1f34b; &#x1f525;系列专栏&#xff1a; &#x1f451;哲学语录: 用力所能及&#xff0c;改变世界。 &#x1f496;如果觉得博主的文章还不错的话&#xff0c;请点赞&#x1f44d;收藏⭐️留言&#x1f4…...

编程新知 2025/6/25 7:35:04

优选算法第十二讲：队列 + 宽搜 优先级队列

优选算法第十二讲&#xff1a;队列 宽搜 && 优先级队列 1.N叉树的层序遍历2.二叉树的锯齿型层序遍历3.二叉树最大宽度4.在每个树行中找最大值5.优先级队列 -- 最后一块石头的重量6.数据流中的第K大元素7.前K个高频单词8.数据流的中位数 1.N叉树的层序遍历 2.二叉树的锯…...

编程新知 2025/7/8 11:33:44

Java 二维码

Java 二维码 **技术&#xff1a;**谷歌 ZXing 实现 首先添加依赖 <!-- 二维码依赖 --><dependency><groupId>com.google.zxing</groupId><artifactId>core</artifactId><version>3.5.1</version></dependency><de…...

编程新知 2025/6/21 12:56:10

CSS设置元素的宽度根据其内容自动调整

width: fit-content 是 CSS 中的一个属性值&#xff0c;用于设置元素的宽度根据其内容自动调整&#xff0c;确保宽度刚好容纳内容而不会超出。 效果对比 默认情况&#xff08;width: auto&#xff09;&#xff1a; 块级元素&#xff08;如 <div>&#xff09;会占满父容器…...

编程新知 2025/6/20 15:09:15

【VLNs篇】07：NavRL—在动态环境中学习安全飞行

项目内容论文标题NavRL: 在动态环境中学习安全飞行 (NavRL: Learning Safe Flight in Dynamic Environments)核心问题解决无人机在包含静态和动态障碍物的复杂环境中进行安全、高效自主导航的挑战&#xff0c;克服传统方法和现有强化学习方法的局限性。核心算法基于近端策略优化…...

编程新知 2025/7/8 0:45:10