倒转字符串

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>vue.js的计算属性</title>

    <script type="text/javascript" src="./js/vue.js"></script>

    <script type="text/javascript">

    window.onload = function(){

        //建立vue对象

        var app = new Vue({

            el:"#a",

            data:{

                message : "你好吗"

            },

            computed:{

                reverseMessage:function(){

                    return this.message.split('').reverse().join('')

                }

            }

        });

        var a = new Vue({

            el:"#q",

            data:{

                message:"你是谁"

            }

        });

    }

    </script>

</head>

<body>

    <div id="a">

    <!-- 颠倒字符串 -->

    {{ message }}<br/>

    {{ reverseMessage }}

    </div>

    <div id="q">

    {{message.split('').reverse('').join('')}}

    </div>

</body>

</html>

简单的Vue计算属性的更多相关文章

  1. Vue计算属性

    github地址:https://github.com/lily1010/vue_learn/tree/master/lesson06 一 计算属性定位 当一些数据需要根据其它数据变化时,这时候就需要 ...

  2. 在做vue计算属性，v-for处理数组时遇到的一个bug

    bug: You may have an infinite update loop in a component render function 无限循环 需要处理的数组(在 ** ssq **里): ...

  3. vue教程2-03 vue计算属性的使用 computed

    vue教程2-03 vue计算属性的使用 computed computed:{ b:function(){ //默认调用get return 值 } } ---------------------- ...

  4. vue 计算属性 实例选项 生命周期

    vue 计算属性: computed:{} 写在new vue()的属性,只要参与运算,数据不发生变化时,次计算只会执行一次,结果缓存,之后的计算会直接从缓存里去结果.如果其中的值发生变化(不管几个) ...

  5. Vue计算属性缓存(computed) vs 方法

    Vue计算属性缓存(computed) vs 方法 实例 <div id="example"> <p>Original message: "{{ ...

  6. vue 计算属性实现过滤关键词

    效果 html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <m ...

  7. Vue 计算属性 && 监视属性

    1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8" /> 5 & ...

  8. Vue#计算属性

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

  9. vue计算属性详解——小白速会

    一.什么是计算属性 模板内的表达式非常便利,但是设计它们的初衷是用于简单运算的.在模板中放入太多的逻辑会让模板过重且难以维护.例如: <div id="example"> ...

随机推荐

  1. delphi10.2 命令行编译x64脚本

    Build.bat @echo off @echo delphi x64编译测试 @cd /d %~dp0 @echo 设置Delphi参数信息 @set SourcePath=%~dp0.\src ...

  2. REST接口

    全名是Representational State Transfer REST是设计风格而不是标准 建议将JSON格式作为标准响应格式 -------------------------------- ...

  3. 102-PHP多维数组的元素输出

    <?php //定义一个三维数组 $grade=array('class1'=>array('stu1'=>array('yuwen'=>85,'shuxue'=>95, ...

  4. 本地Redis服务配置

    本地Redis服务配置 要求:在虚拟机中启动redis服务,并要在windows物理机上取得链接 虚拟机安装略,(结果如下) windows工作机上装了Oracle VM VirtualBox,并在其 ...

  5. centos7下使用yum安装ifconfig工具

    步骤1:搜索安装包 步骤2:使用yum安装 至此,ifconfig工具安装完毕,希望对你有帮助~

  6. hashCode equals hashSet

    基于hash的map也是这种机制. HashSet import java.util.HashSet; import java.util.Set; import java.util.TreeSet; ...

  7. JavaScript的函数和对象介绍

    一.JavaScript中的函数 1.函数的概述 JavaScript中的函数是一段可执行代码的合集,在需要执行的时候可以在方法名之后添加一对小括号执行方法.是一段可执行的字符串. 2.函数中隐藏的属 ...

  8. tornado和vue的模板冲突解决方法

    tornado和vue的模板冲突解决方法 Vue的插值表达式和tornado的模板都为一对花括号,可以通过修改vue的插值表达式的符号来解决这个问题,具体方法如下: var vm = new Vue( ...

  9. POJ - 3349 Snowflake Snow Snowflakes （哈希）

    题意:给定n(0 < n ≤ 100000)个雪花,每个雪花有6个花瓣(花瓣具有一定的长度),问是否存在两个相同的雪花.若两个雪花以某个花瓣为起点顺时针或逆时针各花瓣长度依次相同,则认为两花瓣相 ...

  10. ZOJ - 2671 Cryptography（线段树+求区间矩阵乘积）

    题意:已知n个矩阵(下标从1开始),求下标x~y区间矩阵的乘积.最多m次询问,n ( 1 <= n <= 30,000) and m ( 1 <= m <= 30,000). ...