一般什么时候使用computed？

慕运维5475419 2020-09-03

源自：项目-首页开发 2-12 Vue项目首页 - 首页父子组组件间传值

收起

2回答

好帮手慕久久回答被采纳获得+3积分 2020-09-03 16:01:52

同学你好，不是的，computed中定义的数据也是全局的，与data中的数据一样，它也是可以在其他方法中，使用"this."获取的，如下：

祝学习愉快！

收起回答

好帮手慕久久 2020-09-03 14:58:53

同学你好，问题解答如下：

当我们使用的某个变量，是根据data中的数据或者props中的数据，计算而来时，则需要使用computed属性，比如下面这个例子：

代码如下:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>demo1</title>
    <script type="text/javascript" src="vue.js"></script>
    <style>
    </style>
</head>
<body>
<div id="app">
    <button v-on:click="BtnClick">提交</button>
    {{words}}
</div>
<script>
    let vueApp = new Vue({
        el: '#app',
        data: {
           num:0,    /*已经提交了几次*/
           total:10  /*总共可以提交几次*/
        },
        computed:{
            //页面上 要显示 “还可以提交XX次”
            words:function (){
              return "还可以提交"+(this.total-this.num)+"次"
            }
        },
        methods: {
            BtnClick: function() {
                if(this.num==this.total){  //提交了10次后，就不再对num执行加操作了
                    return
                }
                this.num++
            }
        }
    })
</script>
</body>
</html>

同学可以试下效果。

如果我的回答帮到了你，欢迎采纳，祝学习愉快！

收起回答