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的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程