专栏首页LaravelCodeVuejs 计算属性

Vuejs 计算属性

计算属性 (computed) 处理元数据,便于进行二次利用。(比如:消费税自动计算功能)

HTML:

<div id="myApp">
    今年3月3日发卖的任天堂新一代主机Switch的价格是:{price}円,含税价格为:{priceInTax}円,折合人民币为:{priceChinaRMB}元。
</div>

以上补全花括号{{}}

JavaScript:

<script>
    var myApp = new Vue({
        el: '#myApp',
        data: {
            price: 29980
        },
        computed: {
            priceInTax: function(){
                return this.price * 1.08;
            },
            priceChinaRMB: function(){
                return Math.round(this.priceInTax / 16.75);
            },
        },
    });
</script>

更过用法请参考 计算属性

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Hyperf 初体验-注解

    在 Hyperf 项目 app 目录中创建一个 Annotation 文件夹 比如创建一个 User 类,那么位置就是 app\Annotation\User....

    hedeqiang
  • Vuejs观察属性-侦听器

    与 computed 属性类似,用于观察变量的变化,然后进行相应的处理。 watch 进行实现

    hedeqiang
  • 通过 Laravel 创建一个 Vue 单页面应用(六)

    我们将完成基本 CURD 的最后一部分:创建新用户。您已经拥有了我们之前讨论过的主题中所需要的所有工具,因此可以尝试创建用户并将本文与您的工作进行比较。

    hedeqiang
  • Mysql 存储大数据量问题

    我们说 Mysql 单表适合存储的最大数据量,自然不是说能够存储的最大数据量,如果是说能够存储的最大量,那么,如果你使用自增 ID,最大就可以存储 2^32 或...

    公号-MageByte
  • 搜索框自适应大小 原

    (adsbygoogle = window.adsbygoogle || []).push({});

    tianyawhl
  • dataguard中的密码文件管理(r8笔记第39天)

    这篇文章的动力来自于一个朋友的提问,他问我备库的密码文件直接重建可以吗,我说最好还是复制,如果重建可能会有一些潜在的问题,当然这个所谓潜在问题也是自己给自己打的...

    jeanron100
  • Milvus 如何实现数据动态更新与查询

    在这篇文章,我们会主要描述 Milvus 里向量数据是如何被记录在内存中,以及这些记录以怎样的形式维护。

    ZILLIZ
  • 【大数据】Spark优化经验&案例--数据倾斜

    onephone
  • windows lnk漏洞复现过程

    前言 最近Windows出了一个lnk的漏洞,本着不复现不罢休的原则,自己搭建环境复现了一波,虽然没有这么顺利,但最后还是复现成功,哈哈哈哈,大牛就勿喷了,技术...

    用户1467662
  • 中间件——canal小记

    master将改变记录到二进制日志(binary log)中(这些记录叫做二进制日志事件,binary log events,可以通过show binlog e...

    Zephery

扫码关注云+社区

领取腾讯云代金券