<!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>

</head>

<body>

  <div id="app">

    {{fullName}}

    {{age}}

  </div>

</body>

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

<script>

var app=new Vue({

    el:'#app',

    data:{

      firstName:'li',

      lastName:'zhao',

      age:18

    },

    computed:{

      fullName:{

        get:function(){

          return this.firstName+' '+this.lastName

        },

        set:function(value){

          var arr = value.split(' ');

          this.firstName = arr[0];

          this.lastName = arr[1];

        },

      }

    }

})

</script>

</html>

Vue-computed的set和get的更多相关文章

  1. vue computed 原理

    vue computed 主要依靠数据依赖来更新,这里不展示computed源代码,只展示核心思想. computed: { a(){ return this.b ++ } } data:{ b: 1 ...

  2. Vue computed props pass params

    Vue computed props pass params vue 计算属性传参数 // 计算 spreaderAlias spreaderAlias () { console.log('this. ...

  3. vuex bug & vue computed setter

    vuex bug & vue computed setter https://vuejs.org/v2/guide/computed.html#Computed-Setter [Vue war ...

  4. vue computed、methods、watch的区别

    1.computed(计算属性)computed是计算属性,事实上和和data对象里的数据属性是同一类的(使用上), 2.methods(方法)写在html中的时候需要带()支持传参,且需要有触发条件 ...

  5. Vue computed属性

    computed vs methods 我们可以使用Vue中的method计算出学科的总分,最终得到的总数结果是相同的. 在上例的基础上,我们把computed区块中的totalMarks函数整体移到 ...

  6. 深入理解 Vue Computed 计算属性

    Computed 计算属性是 Vue 中常用的一个功能,我们今天来说一下他的执行过长 拿官网简单的例子来看一下: <div id="example"> <p> ...

  7. vue computed的执行问题

    1.在new Vue()的时候,vue\src\core\instance\index.js里面的_init()初始化各个功能 function Vue (options) { if (process ...

  8. vue computed 可以使用getter和setter

    var vm = new Vue({ data: { a: 1 }, computed: { // 仅读取 aDouble: function () { return this.a * 2 }, // ...

  9. Vue -computed传参数

    vue 中computed想传递参数怎么办? 闭包在这里起到的重要的作用 <input v-model="newItem(key,val)" type="text& ...

  10. vue - computed

    computed 的作用主要是对原数据进行改造输出.改造输出:包括格式的编辑,大小写转换,顺序重排,添加符号……. 一.格式化输出结果: 我们先来做个读出价格的例子:我们读书的原始数据是price:1 ...

随机推荐

  1. Elasticsearch Elasticsearch入门指导

    Elasticsearch入门指导 By:授客 QQ:1033553122 1. 开启elasticsearch服务器 1 2. 基本概念 2 <1> 集群(Cluster) 2 < ...

  2. Android为TV端助力 VelocityTracker 速度追踪器的使用及创建

    VelocityTracker 速度追踪 第一,创建方式: VelocityTracker  mVelocityTracker  = new VelocityTracker .obtain() 第二, ...

  3. vue 构建项目vue-cli

    1.首先得有node和npm的环境,node的下载:http://nodejs.org/download/.安装node之后,npm也自动生成了,显示版本号就意味着安装成功 2.接下来就是安装vue- ...

  4. Linux下图形数据库Neo4j单机安装

    Neo4j数据库简介 Neo4j 是一个NoSQL的图形数据库(Graph Database).Neo4j使用图(graph)相关的概念来描述数据模型,把数据保存为图中的节点以及节点之间的关系.很多应 ...

  5. [20181122]模拟ORA-08103错误.txt

    [20181122]模拟ORA-08103错误.txt $ oerr ora 810308103, 00000, "object no longer exists"// *Caus ...

  6. jvm程序执行慢诊断手册

    生产环境最多的几种事故之一就是程序执行慢,如果是web服务的话,表现就是响应时间长.本文分享,从业多年形成的排查守则. 诊断步骤 系统资源查看 首先是系统资源查看,而且必须是在第一步.因为很多事故都是 ...

  7. win10显示许可证即将过期，但在激活界面显示的仍是已激活问题解决

    win10开机显示"许可证即将过期"怎么办? 很多win10用户在开机的时候遇见了"许可证即将过期"请转到设置种激活windows的问题,但是查询自己的win1 ...

  8. elixir mix 简介

    概述 mix 是 elixir 工程的构建工具,利用 mix,可以快速方便的创建 elixir 工程,写单元测试,管理 elixir 包的依赖管理等等. 我觉得刚开始学习 elixir 的时候,先简单 ...

  9. 力扣算法题—060第K个排列

    给出集合 [1,2,3,…,n],其所有元素共有 n! 种排列. 按大小顺序列出所有排列情况,并一一标记,当 n = 3 时, 所有排列如下: "123" "132&qu ...

  10. Nginx 安装配置

    Nginx("engine x")是一款是由俄罗斯的程序设计师Igor Sysoev所开发高性能的 Web和 反向代理 服务器,也是一个 IMAP/POP3/SMTP 代理服务器. ...