天天看点

初识Vue 3.0 —— 计算属性getter

<h5>14.计算属性getter</h5>
<div class="com">
  <p>姓:</p>
  <input type="text" v-model="firstName" />
  <p>名:</p>
  <input type="text" v-model="lastName" />
  <p>你的名字:<span>{{allName}}</span></p>
</div>
<pre>计算属性默认只有一个getter,也可以新增setter,我的理解:直接通过参数当函数名,挂载时会立即执行计算属性</pre>   
<script type="text/javascript">
  //计算属性 
  const alls = {
    data(){
return{
  firstName:'请输入你的名字',
  lastName:'请输入你的名'
}
    },
    computed:{
allName(){
  return this.firstName+this.lastName;
}
    }
  }
  Vue.createApp(alls).mount('.com');
</script>      

版权声明:原创作品,允许转载,转载时请务必以超链接形式标明文章

​作者信息和本声明。否则将追究法律责任。