其实在摸板中也是可以做简单的计算的,但是会看起来会很乱 ,可以用computed来做计算

  <!DOCTYPE html>

    <html lang="en">

    <head>

        <meta charset="UTF-8">

        <meta name="viewport" content="width=device-width, initial-scale=1.0">

        <meta http-equiv="X-UA-Compatible" content="ie=edge">

        <title>Document</title>

        <div id="app">

        {{ message }}

        {{getAll}}

        </div>

    </head>

    <script src="https://cdn.jsdelivr.net/npm/vue"></script>

    <body>

        <script>

        var app = new Vue({

            el: '#app',

            data: {

                message: 'Hello Vue!',

                initDate:2

            },

            computed:{

                getAll:function () {   //取一个随便的数来

                    return this.initDate*2

                }

            }

        })

        </script>

    </body>

    </html>

computed的用法的更多相关文章

  1. vue 3 学习笔记 (七)——vue3 中 computed 新用法

    vue3 中 的 computed 的使用,由于 vue3 兼容 vue2 的选项式API,所以可以直接使用 vue2的写法,这篇文章主要介绍 vue3 中 computed 的新用法,对比 vue2 ...

  2. watch和computed的用法区别是什么？

    在模板中绑定表达式是非常便利的,但是它们实际上只用于简单的操作.模板是为了描述视图的结构.在模板中放入太多的逻辑会让模板过重且难以维护.这就是为什么 Vue.js 将绑定表达式限制为一个表达式.如果需 ...

  3. vue2 computed set与get函数

    大家都知道computed简单的使用方法,这儿只分享一下setter和getter用法: setter:设置值时触发. getter:获取值时触发,与setter是没有必然联系的. <templ ...

  4. Vue核心知识——computed和watch的细节全面分析

    computed和watch的区别 computed特性 1.是计算值,2.应用:就是简化tempalte里面{{}}计算和处理props或$emit的传值,computed(数据联动).3.具有缓存 ...

  5. vue系列---理解Vue中的computed,watch,methods的区别及源码实现(六)

    _ 阅读目录 一. 理解Vue中的computed用法 二:computed 和 methods的区别? 三:Vue中的watch的用法 四:computed的基本原理及源码实现 回到顶部 一. 理解 ...

  6. 基于vue2.0原理-自己实现MVVM框架之computed计算属性

    基于上一篇data的双向绑定,这一篇来聊聊computed的实现原理及自己实现计算属性. 一.先聊下Computed的用法 写一个最简单的小demo,展示用户的名字和年龄,代码如下: <body ...

  7. vue3中使用computed

    演示示例(vant组件库的轮播图): <van-swipe :loop="false" :width="150" class="my-Swipe ...

  8. vue3 高阶 API 大汇总，强到离谱

    高阶函数是什么呢? 高阶函数英文名叫:Higher Order function ,一个函数可以接收一个或多个函数作为输入,或者输出一个函数,至少满足上述条件之一的函数,叫做高阶函数. 前言 本篇内容 ...

  9. Vue3 中有哪些值得深究的知识点？

    众所周知,前端技术一直更新很快,这不 vue3 也问世这么久了,今天就来给大家分享下vue3中值得注意的知识点.喜欢的话建议收藏,点个关注! 1.createApp vue2 和 vue3 在创建实例 ...

随机推荐

  1. selenium用法详解以chrome为例

    selenium 是一套完整的web应用程序测试系统,包含了测试的录制(selenium IDE),编写及运行(Selenium Remote Control)和测试的并行处理(Selenium Gr ...

  2. 【雅思】【绿宝书错词本】List25~36

    List 25 ❤arable a.可耕作的 n.耕地 ❤congested a.拥挤不堪的:充塞的 ❤split v.(使)分裂,分离:(被)撕裂:裂开:劈开:分担,分享n.裂口:分化 ,分裂 ❤n ...

  3. Hadoop常用命令及范例

    hadoop中的zookeeper,hdfs,以及hive,hbase都是hadoop的组件,要学会熟练掌握相关的命令及其使用规则,下面就是一些常用命令及对hbase和hive的操作语句,同时也列出了 ...

  4. 详解html中的marquee属性

    转自:https://www.jb51.net/web/531309.html 该标签不是HTML3.2的一部分,并且只支持MSIE3以后内核,所以如果你使用非IE内核浏览器(如:Netscape)可 ...

  5. js 数组 去重 算法（转载）

    以下内容可能有重复部分,项目有用上,但还没来得急整理和验证. 一:https://www.cnblogs.com/jiayuexuan/p/7527055.html 1.遍历数组法 它是最简单的数组去 ...

  6. Linux 绑定 ttyUSBn 串口方法。

    Linux 绑定 ttyUSBn 串口方法. 在linux下, 使用usb转串口, 经常会碰到一个问题: 如果有多个串口, 以不同顺序插入的时候, /dev/ttyUSB0 /dev/ttyUSB1的 ...

  7. openwrt配置strongswan对接hillstone ipsec的笔记

    一.主要参考资料: https://openwrt.org/docs/guide-user/services/vpn/ipsec/strongswan/roadwarrior https://open ...

  8. 搭建React项目环境【1】

    1.安装NodeJS6.0以上自带npm依赖包管理工具 2.webstrom 2019.2 工具 1.在cmd输入node -v就可以看到node的当前版本 2.在输入node进入node环境 3.查 ...

  9. linux系统编程之管道(三)

    今天继续研究管道的内容,这次主要是研究一下命名管道,以及与之前学过的匿名管道的区别,话不多说,进入正题: 所以说,我们要知道命名管道的作用,可以进行毫无关系的两个进程间进行通讯,这是匿名管道所无法实现 ...

  10. 版本控制Git研究二

    经过好几周的工作忙碌,终于可以有时间静下心来学习东西了,做为崇尚技术的人来说,应该是最幸福的时光了,呵呵,当然也是宅神的表现啦,话不多说,继续git的学习,上次已经对git的一些概念进行了说明,具体可 ...