Vue模板语法


Vue模版语法有2大类:

插值语法

1.插值语法:
功能:用于解析标签体内容
写法:{{xxx}},xxx是js表达式,且可以直接读取到data中的所有属性
在这里插入图片描述

指令语法

2.指令语法:
功能:用于解析标签(包括:标签属性、标签体内容、绑定事件…)
举例:v-bind:herf="xxx"或 简写为 :herf=“xxx”,xxx同样要写js表达式且可以直接读取到data中的所有属性
备注:Vue中有很多的指令,且形式都是:v-???,此处我们只是拿v-bind举个例子 在这里插入图片描述
想要区分两个不同的name值,就需要在实例中用到嵌套,在data中嵌套一个Apple(自定义名称),然后在给Apple添加一个name,再引用{{Apple.name}}就可以实现不同地方引用name表达不同结果了
在这里插入图片描述
页面效果展示:
在这里插入图片描述
在这里插入图片描述
这就是插值语法与指令语法。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值