58Vue - Props（字面量语法 vs 动态语法）

原创

阿甘兄_ 2022-03-24 11:02:58 ©著作权

©著作权归作者所有：来自51CTO博客作者阿甘兄_的原创作品，请联系作者获取转载授权，否则将追究法律责任

初学者常犯的一个错误是使用字面量语法传递数值：

<!-- 传递了一个字符串"1" -->
<comp some-prop="1"></comp>

因为它是一个字面 prop ，它的值以字符串 “1” 而不是以实际的数字传下去。如果想传递一个实际的 JavaScript 数字，需要使用 v-bind ，从而让它的值被当作 JavaScript 表达式计算：

<!-- 传递实际的数字 -->
<comp v-bind:some-prop="1"></comp>

上一篇：57Vue - Props（动态 Props）

下一篇：56Vue - Props（camelCase vs. kebab-case）

提问和评论都可以，用心的回复会被更多人看到评论

发布评论

相关文章

Vue学习计划-Vue3--核心语法（四）标签的ref属性、props父子通信

1. 标签的ref属性作用：用于注册模板引用用在普通DOM标签上，获取的使DOM节点用在组件标签上，获取的是组件实例对象用在子组件上，父组件想要访问子组件内的数据，需要使用defineExpose暴露用在普通DOM标签上：<template> <div> <h2>哈哈</h2> <h2 ref=&

ref属性 props 父子通信
Vue 中使用 jsx 语法

大多数 Vue 开发者都习惯使用 template 模板语法，因为 template 模板语法具有如下优点：熟悉的类 HTML 结构模板语法可以像 HTML 一样进行布局和设计，上手快、学习成本比低更简洁的写法例如，可以在模板中使用各种修饰符来达到简化编写代码的过程结构与逻辑分离元素结构和逻辑并没有杂糅在一起，因此结构上更

插槽 html 修饰符
Vue学习计划-Vue3--核心语法（七）pinia

pinia案例gitee地址1. pinia准备一个效果【搭建 pinia 环境】安装pinia: npm install pinia/yarn add pinia第二步：操作src/main.tsimport { createApp } from 'vue'import App from './App.vue'/* 引入createPinia，用于创建pinia

pinia
iOS - 巧用字面量语法

在编写代码时，总会遇到一些Foundation框架的类，分别是NSString，NSNumber，NSArray，NSDictionary。如你所见是我们最

ios 字面量数组字符串
字面量语法的使用--IOS

字面量语法的使用--IOS 使用oc时，经常会用到NSString，NSNumber，NSArray，NSDictionary，下面是关于他们的字面量语法的使用。（1）字面数值有时需要把整数，浮点数，布尔值封入oc对象中一般写法： NSNumber *num = [NSNumber number

字面量数组浮点数
【python_4】基础语法：字面量和注释！

1.字面量的含义字面量：在代码中，被写下来的固定的值，称之为字面量。2.常见的字面量类型类型描述说明数字Number支持：整数int浮点数float复数complex布尔bool整数int，如10，-10浮点数float，如13.14，-13.14复数complex，如4+3j布尔bool，表达现实生活中的逻辑，即真和假，True表示真，False表示假。True本质上是一个数字记作1，False

python 字面量单行注释多行注释零基础学python
03-ES6语法：模板字面量(Template Literals)

ES6引入了模板字面量（Template Literals），对多行字符串和字符串占位符的操作进行了增强。本文对这方面的内容进行了详细的介绍。

ES6 模板字面量模板字符串字符串占位符字符串插值
java【运算符、字面量优化】（OC中的糖衣语法、Java的字面量优化）

糖衣语法，又叫“语法糖”“语法盐”等，是由英国计算机科学家彼得·约翰·兰达（Peter J.Landin）发明的一个术语，指计算机语言中添加的某种语法，这种语法对语言的功能并没有影响，但是更方便程序员使用。通常来说，使用糖衣语法能够增加程序的可读性，从而减少程序代码出错的机会。糖...

iOS 操作符数组封装其他
57Vue - Props（动态 Props）

类似于用 v-bind 绑定 HTML 特性到一个表达式，也可以用 v-bind 动态绑定 props 的值到父组件的数据中。每当父组件的数据变化时，该变化也会传导给子组件：<div> <input v-model="parentMsg"> <br> <child v-bind:my-message="parentMsg"></c...

# Vue
oracle学习58-plsql轻量版基本语法

o

oracle 学习数据库
【Vue】基础系列（二）Vue模板语法-插值语法-指令语法

【Vue】基础系列（二）Vue模板语法-插值语法-指令语法

vue.js 前端 javascript html 插值
[vue] Vue模板语法

Vue模板语法有2大类：1.插值语法：功能：用于解析标签体内容。写法：{{xxx}}，xxx是js表达式，且可以直接读取到d

vue.js Vue html javascript
React工作59:this.props语法糖

{...this.props}是props所提供的语法糖，可以将父组件的所有属性复制给子组件

语法糖
Vue 字面量语法 vs 动态语法

初学者常犯的一个错误是使用字面量语法传递数值：因为它是一个字面量 prop，它的值是字符串 "1" 而不是一个数值。如果想传递一个真正的 JavaScript 数值，则需要使用 v-bind，从而让它的值被当作 JavaScript 表达式计算：

VUE 字面量语法动态语法字面量字符串
字面量(笑笑语法)

1.NSString *greeting = [NSStringstringWithUTF8String:"hello"]; NSString *greeting =@"hello";2.NSArray *array = [NSArray arrayWithObjects:a,b,c,nil]; N...

数组键值对对象赋值 c语言数据
java props 语法

jsp网站开发常常涉及到文档数据导入导出，如excel文件的操作下面介绍一种技术POI操作excel文档，简单介绍的一个POI的HelloWorld 使用POI可以操作excel03版也就是xls后缀名的excel和07的xlsx文档，当然API略有差异开始学习POI 操作03版excel———-读写public void testWriteTo03Excel() throws Exce

java props 语法 poi excel 数据 Test
一、VS支持Vue语法

一、VS支持Vue语法

知识
vue 语法

vue 语法模板语法  <div id="app"> <p>{{ message }}</p> </div>  <div id="app"> <div v-html="message"> ...

vue 数据 html 修饰符 javascript
语法糖 python 语法糖vue

前言提示：Vue3.2 版本开始才能使用语法糖！<script setup>是在单文件组件 (SFC) 中使用组合式 API 的编译时语法糖。在 Vue3.2 中只需要在 script 标签上加上setup属性，无需 return，template 便可直接使用。相比于普通的更少的样板内容，更简洁的代码。能够使用纯TypeScript 声明props和抛出事件。更好的运行时性能 (其模

语法糖 python vue.js javascript 前端 ide
语法糖 javascript 语法糖vue

由于原来vue3中的setup Composition API 语法太过于冗长麻烦，官方又出了这么个语法糖，非常的好用了。这里介绍一些常用的语法：一、如何开始使用？1、需要关闭vetur插件，安装Volar插件2、tsconfig.json / jsconfig.json 文件，在compilerOptions里面加上 "strict": true，和 "moduleResolutio

vue 数据 ide API
java 多线程同步大批量数据

使用synchronized关键字来修饰某个方法，该方法被称为同步方法。对于synchronized修饰的实例方法（非static方法），无需显示指定同步监视器，同步方法的同步监视器是this，也就是调用该方法的对象。通过同步方法可以非常方便的实现线程安全的类，线程安全的类具有如下特征：　　该类的对象可以被多个线程对象安全访问　　每个线程调用该对象的任意方法后将得到正确的结果　　每个线程调用该对象

java 多线程同步大批量数据 java 同步方法线程安全同步代码块
javacv需要安装本地库吗

前言Java虽然是一个比较老的语言，但到现在依然充满了活力，各种开源框架层出不穷，丰富的社区资源都对Java的发展和应用都提供了极大的帮助。对于想学习Java开发的小伙伴，第一步就是要搭建开发环境，然后才能进行更好的开展后续的学习和工作。那接下来我们就一起看看怎么从0到1搭建一个Java开发环境吧。搭建Java开发环境，我们首先需要准备相应的软件安装包，我们本次的软件清单如下：JDK 8Intel

javacv需要安装本地库吗 java环境搭建 MySQL Java mysql
es6模块化的原理

前言学习记录浅学了一下ES6 module的用法和基本概念 1.概述在ES6之前，社区制定了一些模块加载方案，最主要的有CommonJS和AMD两种。前者用于服务器，后者用于浏览器。【只能在运行时确定】ES6 module是在浏览器和服务器上的通用解决方案。CommonJS模块就是对象，输入时必须查找对象属性。// CommonJS模块 let { stat, exists, readfile

es6模块化的原理 es6 前端 javascript ecmascript
java 数值型判断为空

目录一、数据类型分类二、基本数据类型1.byte2.整型3.char4.浮点型5.boolean三.基本数据类型转换1.自动类型转换2.强制类型转换3.string与基本数据类型的转一、数据类型分类数据类型可分为基本数据类型和引用数据类型。其中，基本数据类型有：byte , short , int , long , char , float , double , boolean ; 引用数据类

java 数值型判断为空开发语言 java 数据类型基本数据类型
python gis坐标系84转换2000

坐标系的转换1.为什么要进行坐标系的转换？2. 不同坐标系的介绍1.地理坐标系我国常见的地理坐标(1).北京54坐标系(2).西安80坐标系(3).WGS-84坐标系(4).大地2000坐标系2.投影坐标系我国常用的投影坐标系(1) UTM投影(2) 高斯-克吕格投影(3) 兰伯特投影(4) 阿尔伯斯投影投影坐标系的选择3. 坐标系的转换1.已知坐标系之间的转换1.1 两坐标系的参考椭球相同1.

arcgis 二维坐标系统数据

官方博客	全部文章	热门标签	班级博客
了解我们	网站地图	意见反馈

鸿蒙开发者社区	51CTO学堂
51CTO	软考资讯