倒转字符串

<!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. SNOI2019 选做

    施工中... d1t1 字符串 题面 考虑两个字符串 \(s_i,s_j(i<j)\) ,实质是 \(s[i+1,\dots j]\) 和 \(s[i,\dots ,j-1]\) 的字符串字典序 ...

  2. 解决d7在更高版本上运行乱码问题，或者是调用更高版本的dll

    将String类型改成WideString类型即可

  3. 吴裕雄--天生自然java开发常用类库学习笔记：线程的生命周期

    class MyThread implements Runnable{ private boolean flag = true ; // 定义标志位 public void run(){ int i ...

  4. python正则表达式匹配多行

    参数re.S jsProp = 'b' fpData = '''var a = []; var b = []; var c = [];'''   .*是尽可能匹配多的 searchResult = r ...

  5. php.laravel.部署

    Laravel 的部署 D  参考laravel-china的做 | 其他参考 | 重要的参考 | Nginx github | 如果想要ssl 啊

  6. java se

    集群 数据库集群.服务器集群.内存 java特性 封装:封装细节和封装变化(可能发生需求变更的代码必须要封装,set方法除了完成赋值功能外,还能处理额外的任务,记录访问的人) 继承 多态 访问限定符 ...

  7. 二十一、JavaScript之访问对象属性

    一.代码如下 二.执行效果如下 <!DOCTYPE html> <html> <meta http-equiv="Content-Type" cont ...

  8. ubuntu12.04 安装完XRDP显示空白桌面

    先放链接:http://c-nergy.be/blog/?p=3518 在ubuntu软件中心搜索:fallback session,安装gnome-session-fallback: 在主文件夹(h ...

  9. Bean Java配置

    Spring 系列教程 Spring 框架介绍 Spring 框架模块 Spring开发环境搭建(Eclipse) 创建一个简单的Spring应用 Spring 控制反转容器(Inversion of ...

  10. POJ2002 &&HDU5365 判断给定的点中有多少个不同的正方形

    Squares Time Limit: 3500MS   Memory Limit: 65536K Total Submissions: 17740   Accepted: 6776 Descript ...