您现在的位置是：网站首页> 编程资料编程资料

Vue.js中关于“{{}}”的用法_vue.js_

2023-05-24 321人已围观

简介 Vue.js中关于“{{}}”的用法_vue.js_

关于“{{}}”的用法

Vue.js核心库只关注视图层，而我们只需要注重数据的操作就好，通过接下来的学习会更深的理解这句话，vue.js通过很多指令和修饰符来完成对视图的关注，第一个是{{}}

Document
 {{userName}} {{true?'男':'女'}} {{userName.split("").reverse().join("")}}

执行结果：

Vue表达式{{}}中拼接字符

在表达式中我们一直都只绑定简单的键值。但实际上，对于所有的数据绑定，Vue.js 都提供了完全的 JavaScript 表达式支持。

例如：

{{ number + 1 }}    
{{ ok ? 'YES' : 'NO' }}
{{ message.split('').reverse().join('') }}

但是最近我有一个需求，就是在表达式中进行一个拼接。

        
           
             
               {{item.start_at}}至{{item.end_at}}             
             
               
                 
推荐人数
                 
奖金池
                 
累计奖金
                 
获得分红
               
               
                 
{{props.invite_number}}
                 
{{props.pool_index}}
                 
{{item[String(props.pool_index) + '_pool']}}
                 
{{props.money}}
               
             
           
        

大家着重看这段代码

{{item[String(props.pool_index) + '_pool']}}

这个是利用第二个循环里的一个数据props.pool_index来拼接成第一个循环里的相对应一个数据(item.4_pool)

以上为个人经验，希望能给大家一个参考，也希望大家多多支持。

您可能感兴趣的文章:

上一篇：Vue中emit事件无法触发的问题及解决_vue.js_

下一篇：前端算法leetcode109题解有序链表转换二叉搜索树_JavaScript_

相关内容

点击排行

本栏推荐

猜你喜欢

-六神源码网