首页 > 其他分享> > 20210606vue学习笔记

20210606vue学习笔记

2021-06-07 13:31:58 作者：互联网

20210606vue学习笔记

计算属性的使用
同种情况如果既可以使用computued，和method，多用computued

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id  = "app">
        <h2>{{firstName+' '+lastName}}</h2>
        <h2>{{getFullName()}}</h2>
        <h2>{{fullName}}</h2>//不需要（）因为调用时默认调用了get方法
    </div>


    <script src ="../test/vue.js"></script>
    <script>
        const app=new Vue({
               el:'#app',
               data:{   //用于挂载元素
                    firstName:'Lebron',
                    lastName:'James'   
               } ,
               computed:{
                    fullName:function(){
                        return  this.firstName+' '+this.lastName
                    }
               },
               methods:{
                   getFullName(){
                    return  this.firstName+' '+this.lastName
                   }
               }
        })
    </script>
</body>
</html>

标签：20210606vue,firstName,lastName,app,笔记,学习,getFullName,computued
来源： https://blog.csdn.net/weixin_45459322/article/details/117625629