vue-编程基础-插值语句、指令-02
2021/5/18 20:56:47
本文主要是介绍vue-编程基础-插值语句、指令-02,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
1、绑定语法: 学名:插值语法Interpolation
插值语法就是在HTML中插入js中定义的变量的值,与之前的dom操作元素内容作用相同,却别是更加方便简化
定义:在界面中标记哪里可能发生变化的特殊的语法
使用方式:<元素>{ {变量名}}</元素>
特征:双花括号
原理:开局, new Vue()扫描到这里时,就会将这个元素保存到虚拟DOM树中,当【{ {值}}】中的变量在new Vue()中被修改时,虚拟DOM树就会找到这个元素,自动更新这个元素的内容与new Vue()同名变量保持一致!
混搭:在实际编程中{ {变量名}}可以和其他字符串内容混搭。不必须是单纯的元素
规则:{ {}}之中:和模板字符串的${}规则一样
(1). 可以写:变量,运算,三目,调用函数,创建对象,访问数组元素——一切合法的有返回值的js表达式
(2). 不能写:程序结构(分支和循环), 以及没有返回值的js表达式。
<div id="app"> <div>姓名:{ {uname}}</div> <div>{ {sex}}</div> <div>性别:{ {sex?'男':'女'}}<
这篇关于vue-编程基础-插值语句、指令-02的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-12-29如何在 Vue2 的 uni-app 项目中使用 npm ?-icode9专业技术文章分享
- 2024-12-29uni-app vue2微信小程序项目在哪里打开终端并使用npm?-icode9专业技术文章分享
- 2024-12-29怎么在 uni-app Vue2 项目中全局引入 Vant Weapp?-icode9专业技术文章分享
- 2024-12-29uni-app vue2微信小程序项目如何在main.js中全局引入vant?-icode9专业技术文章分享
- 2024-12-28Vue入门教程:从零开始搭建第一个Vue项目
- 2024-12-28Vue CLI入门指南:快速搭建Vue项目
- 2024-12-28Vue3基础知识入门教程
- 2024-12-28Vue3公共组件开发与使用入门教程
- 2024-12-28Vue CLI学习:新手入门教程
- 2024-12-28Vue CLI学习:轻松入门与实践指南