为了账号安全,请及时绑定邮箱和手机立即绑定

为什么我的click方法,不能改变content内容,点击没有效果

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Vue 学习</title>
    <script type="text/javascript" src="vue.js"></script>
</head>
<body>
    <div id="root">
        <h1 v-on:click="handleClick">{{content}}</h1>
    </div>
    <script type="text/javascript">
    new Vue({
        el: "#root",
        data: {
            content: "Hola"
        },
        methods: {
            handleClick: () => {
                this.content = "Suremotoo";
            }
        }
    });
    </script>
</body>
</html>


正在回答

2 回答

注意,不应该使用箭头函数来定义 method 函数 (例如 plus: () => this.a++)。理由是箭头函数绑定了父级作用域的上下文,所以 this 将不会按照期望指向 Vue 实例,this.a 将是 undefined。

2 回复 有任何疑惑可以回复我~
#1

优越感

“箭头函数绑定了父级作用域的上下文,所以 this 将不会按照期望指向 Vue 实例” 那这里的this指的啥?
2019-04-25 回复 有任何疑惑可以回复我~

Sorry,我找到问题了,将以下代码替换

handleClick:  () => {
                this.content = "Suremotoo";
   }
handleClick: function() {
                this.content = "Suremotoo";
            }

看来不会es6的不要随便用。

1 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

为什么我的click方法,不能改变content内容,点击没有效果

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信