<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>vue 计算属性的学习</title>
 <script type="text/javascript" src="./js/vue.js"></script>
 <script type="text/javascript">
 window.onload = function(){
  var app = new Vue({
   el:"#app",
   data:{
    information:'灰色的世界里,只有你的眼睛是色彩斑斓的'
   },
   computed:{
    reverseInformation:function(){
     return this.information.split('').reverse().join('')
    }
   }
  });
 }
 
 </script>
</head>
<body>
 <div id="app">
  <!-- 颠倒字符串  上面的是原版下面的是颠倒版-->
  {{information}}
  <br/><br/>
  {{reverseInformation}}
  <br/><br/>
  {{information.split('').reverse()}}
  <br/>
  {{information.split('').join('')}}
 </div>
 
</body>
</html>

vue.js的计算机属性学习的更多相关文章

  1. vue.js操作元素属性

    vue动态操作div的class 看代码: <!doctype html> <html lang="en"> <head> <meta c ...

  2. 9.Vue.js 监听属性

    本章节,我们将为大家介绍 Vue.js 监听属性 watch,我们可以通过 watch 来响应数据的变化. 以下实例通过使用 watch 实现计数器: <div id = "app&q ...

  3. vue.js 监听属性的学习/ 千米、米的转换 /时、分、秒 的转换

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  4. vue.js事件,属性,以及交互

    这是我学习vue的第二天,今天主要学习了如何利用vue阻止事件冒泡,阻止事件的默认行为,键盘事件以及如何添加class.style这些属性,以及如何利用vue来进行数据交互,利用百度的一个API来写一 ...

  5. Vue.js官方文档学习笔记(一)起步篇

    Vue.js起步 Vue.js介绍 Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库 ...

  6. 关于vue.js的计算属性练习代码

    参照官网联系如下: <!DOCTYPE html><html lang="en"><head> <meta charset="U ...

  7. vue.js实战——计算属性

    1set和get: 注意: this.lastName=names[names.length-1];//解决连续输入空格后lastName消失的问题 练习代码如下: <!DOCTYPE html ...

  8. Vue.js:计算属性

    ylbtech-Vue.js:计算属性 1.返回顶部 1. Vue.js 计算属性 计算属性关键词: computed. 计算属性在处理一些复杂逻辑时是很有用的. 可以看下以下反转字符串的例子: 实例 ...

  9. Vue.js之计算属性(computed)、属性监听(watch)与方法选项(methods)

    vue.js官网:https://cn.vuejs.org/v2/guide/components-registration.html 一.计算属性-computed 1. 作用:能够避免数据冗余,通 ...

随机推荐

  1. Educational Codeforces Round 47 (Rated for Div. 2)E.Intercity Travelling

    题目链接 大意:一段旅途长度N,中间可能存在N-1个休息站,连续走k长度时,疲劳值为a1+a2+...+aka_1+a_2+...+a_ka1​+a2​+...+ak​,休息后a1a_1a1​开始计, ...

  2. PKUSC2018游记

    由于菜鸡DreamlessDreams还需要准备中考的原因....这篇游记拖到今天才发. Day0:出发+报道                                              ...

  3. python - 语言介绍

    python 程序的执行过程 python 的实现 Cpython 原始.标准的实现方式 Jython 用于与Java语言继承的实现 Ironpython 用于与.net框架继承的实现 python ...

  4. vue购物车实战项02

    1.数据循环.绑定 v- 绑定的属性 都是变量 ( 小程序这块需要花括号 不同点) 2.列表点击 当绑定变量为一个对象的时候{} 属性根据里面的属性值 bool 值  是否返回 当前的属性 转化成cl ...

  5. Django 基于类的通用视图

    在早期,我们认识到在视图开发过程中有共同的用法和模式.这时我们引入基于函数的通用视图来抽象这些模式以简化常见情形的视图开发. 基于函数视图的用法有以下三种: def index(request): r ...

  6. HDOJ 1698 Just a Hook (线段树)

    题目: Problem Description In the game of DotA, Pudge’s meat hook is actually the most horrible thing f ...

  7. Shell基础总结

    一.用户登陆进入系统后的系统环境变量 $HOME 使用者自己的目录 $PATH 执行命令时所搜寻的目录 $TZ 时区 $MAILCHECK 每隔多少秒检查是否有新的信件 $PS1 在命令列时的提示号 ...

  8. Node.js WEB服务器(1)——编写简单的HTTP服务器

    基于分而治之的思想,很多架构都会采用分层的模式来处理某类应用.Node.js在Web开发上也是采用这种模式,分别提供了如下的三个层: Node核心 社区模块 应用逻辑 下面是一个最简形式的web服务器 ...

  9. boost::asio实现一个echo服务器

    以前使用ACE实现Server框架,但是觉得太笨重,决定采用boost.asio来写服务器程序: 1.服务器构建在linux上面:当然也可以在windows下运行 2.io部分采用非阻塞模式.业务逻辑 ...

  10. elasticsearch自动按天创建索引脚本

    elasticsearch保存在一个索引中数据量太大无法查询,现在需要将索引按照天来建,查询的时候关联查询即可 有时候es集群创建了很多索引,删不掉,如果是测试环境或者初始化es集群(清空所有数据), ...