vue中的计算属性 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<div id="demo">
    姓：<input type="text" placeholder="First Name" v-model="firstName"><br/>
    名：<input type="text" placeholder="Last Name" v-model="lastName"><br/>
    姓名1：<input type="text" placeholder="Full Name1" v-model="fullName1"><br/>
    姓名2：<input type="text" placeholder="Full Name2" v-model="fullName2"><br/>
    姓名3：<input type="text" placeholder="Full Name3" v-model="fullName3"><br/>
</div>



<script src="../js/vue.js"></script>

<script>
    //实例对象  就是vm
    var app = new Vue({
        el: '#demo',
        data: {   //数据 （model）
            firstName: 'A',
            lastName: 'B'
        },
        computed:{
            fullName1(){
                return this.firstName +' '+ this.lastName;
            }
        }
    })
</script>
</body>
</html>
posted @ 2021-07-11 03:38  King-DA  阅读(23)  评论(0)    收藏  举报