vue-基础指令和属性绑定

最新推荐文章于 2024-05-10 18:15:56 发布

Y636

最新推荐文章于 2024-05-10 18:15:56 发布

阅读量350

点赞数

文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/weixin_56464670/article/details/126591201

版权

v-text、v-html、v-cloak、v-bind、{{}}

摘要由CSDN通过智能技术生成

一、基础指令

1、插值表达式

普通插值表达式插入数据: 在标签尖括号中使用{ { }}插入js表达式:变量,函数调用,三目运算等等 ,插值表达式中的标识符代表vue对象中的data的属性名或者methods中的方法名

<div class="box">
        <li>{
  {first}}</li>
        <li>{
  {second}}</li>
        <li>{
  {four}}</li>
        <li>{
  {five + text.age}}</li>
        <li>{
  {text.age}}</li>
        <li>{
  {arr[0]}}</li>
        <li>{
  {fn()}}</li>
        <!-- <li>{
  {fn}}</li> -->
    </div>
<script>

        var text = {
            age: 10
        }

        var arr = ["hello world!", 1111]
        var obj = ({
            el: ".box",
            data: {
                first: "张三",
                second: "李四",
                four: "王二",
                five: "甲乙丙丁",
                te